2. Bindings de boucle
Parfois, votre formulaire contient plusieurs items, et plusieurs éléments <input>
pour un même
item. C'est le cas de la todo-list suivante :
<script>
let items = $state([
{ done: false, text: 'Peindre le studio' },
{ done: false, text: 'Tondre la pelouse' },
{ done: false, text: 'Dominer le monde' }
]);
</script>
{#each items as item}
<div>
<input type="checkbox" bind:checked={item.done} />
<input placeholder="Que reste t'il à faire ?" bind:value={item.text} disabled={item.done} />
</div>
{/each}
Dans ce cas, vous pouvez utiliser bind:
pour lier les valeurs des <input>
aux champs des items
correspondants.