Svelte: Array binding not works properly.

Created on 14 Jul 2019  路  10Comments  路  Source: sveltejs/svelte

All 10 comments

I can confirm something strange and unexpected is happening, arrays of arrays are stacking their bindings together.
Click 3 or more checkboxes from different groups and check how the pool is getting filled all mixed between then.
https://svelte.dev/repl/f0bf97fb63db4bf6a44108cf11437cd8?version=3.6.7

Here is a more verbose example which is also using keys but still suffer from the same problem.

https://svelte.dev/repl/116356aaaf0d49669be609064c3bd0a9?version=3.6.7

I have also created the lists manually just to make sure that it wasn't the {#each} loop causing the issue and the problem seem to persists.

https://svelte.dev/repl/d487732496574e1286837f07ae533872?version=3.6.7

Noticed too...
Somehow fixes the problem, if you move the inner _each_ block to a separate component.

https://svelte.dev/repl/b1832504a78a4fc7853148c711d5c916?version=3.6.7

https://svelte.dev/tutorial/each-block-bindings
'Remaning' not working as expected, it should count only not done

$: remaining = todos.filter(t => !t.done).length;

It does if you complete the tutorial with the bind: statements as directed.

Using bind:group inside of an {#each} should work now in 3.23.2 with the addition of #4868.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

AntoninBeaufort picture AntoninBeaufort  路  3Comments

Rich-Harris picture Rich-Harris  路  3Comments

thoughtspile picture thoughtspile  路  3Comments

robnagler picture robnagler  路  3Comments

sskyy picture sskyy  路  3Comments