Cases sans clé

Une liste sans :key affiche trois livres, chacun avec une case à cocher que Vue ne gère pas. On coche « Analyse », puis on clique sur « Retirer le premier ». Quelle case est cochée ? Et avec :key="livre" ?

<div id="app">
  <ul>
    <li v-for="livre in livres">
      <label><input type="checkbox"> {{ livre }}</label>
    </li>
  </ul>
  <button type="button" @click="livres.shift()">Retirer le premier</button>
</div>

const { createApp, ref } = Vue;

createApp({
  setup() {
    const livres = ref(["Java", "Analyse", "Petit Prince"]);
    return { livres };
  },
}).mount("#app");