sveltejs / svelte

Cybernetically enhanced web apps
https://svelte.dev
MIT License
78.46k stars 4.11k forks source link

CRUD Example Doesn't Work #2852

Closed elliotwaite closed 5 years ago

elliotwaite commented 5 years ago

In the CRUD Example (https://svelte.dev/examples#7guis-crud), the first name and last name input values can't be edited when a person is selected. However, if this code:

$: {
  first = selected ? selected.first : '';
  last = selected ? selected.last : '';
}

...is changed to this code:

$: reset_inputs(selected);

...it works. Which is how it used to be coded before this change on Apr 15, 2019.

It seems like the new code should work, but for some reason changing the input value causes the code to think the selected variable also changed, causing it to re-update the first and last variables back to selected.first and selected.last, undoing the change.

Here are two simplified REPLs that demonstrate the issue.

Current method (can't change the input): https://svelte.dev/repl/ed93c532b30b4939b7d1da74363c2761?version=3.4.2

<script>
  let people = ['Hans'];
  let first = '';
  $: {
    first = people[0];
  }
</script>
<input bind:value={first}>

Previous method (can change the input): https://svelte.dev/repl/9a5f97f2bdb44a00a24cf6d8b017da26?version=3.4.2

<script>
  let people = ['Hans'];
  let first = '';
  $: reset_input(people[0]);
  function reset_input(val) {
    first = val;
  }
</script>
<input bind:value={first}>

Should the example code just be reverted to using the previous method, or does this issue point to an underlying bug?

bionicles commented 5 years ago

Multiple prs fix this

elliotwaite commented 5 years ago

This fix has been merged: https://github.com/sveltejs/svelte/pull/2860