Runes mode: Binding in each loop not working
#14702In runes mode, when iterating an array of objects in an each loop, it is not possible to bind the object to a component.
<svelte:options runes={true} />
<script>
import Component from "./Component.svelte"
let objs = [{
val: "foo"
}]
</script>
{#each objs as obj}
<Component bind:obj />
{/each}
Error each_item_invalid_assignment
is raised. This works fine when runes mode is disabled.
https://svelte.dev/playground/71e6da2a2afd4a5e812bdd7263e5c7dd?version=5.12.0
Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. `array[i] = value` instead of `entry = value`)
https://svelte.dev/e/each_item_invalid_assignment
svelte 5.12.0, see repl
blocking an upgrade
This comes up regularly, maybe the error message should be better? the error message tells you exactly what to do.
Use the array and index variables instead (e.g.
array[i] = value
instead ofentry = value
)
You need to use the index: https://svelte.dev/playground/3d2230fb0247489dafb27f995901b1a6?version=5.12.0
Edit: still, the error message is a little poorly worded and does not look like a binding, it should be:
(e.g.
bind:value={array[i]
instead ofbind:value={entry}
)