search

tjinauyeung / svelte-forms-lib

📝. A lightweight library for managing forms in Svelte
https://svelte-forms-lib-sapper-docs.now.sh/
MIT License
604 stars 59 forks source link

OnChange (handleChange func) #162

Open arensade opened 2 years ago

arensade commented 2 years ago

Hi, I'm curious what is exactly handleChange in example page

<input id="name" name="name" on:change={handleChange} bind:value={$form.name} />

When we remove on:change={handleChange} still getting changes on submit function.

dlebech commented 2 years ago

If you have bind:value={$form.someValue} on your form field, then the form will still get updated when the field changes.

Therefore, it looks like handleChange is not necessary.

However, handleChange both changes the value of the form field and it runs validation on the field instantly. It requires a name or id field on the form field to work.

When you use bind:value as well as handleChange, I guess the value is technically being updated twice -- once by Svelte and once by the forms lib. As such, you could argue that bind:value={$form.someValue} should be changed to value={$form.someValue in the examples.

dlebech commented 2 years ago

See also this issue which describes the same thing: https://github.com/tjinauyeung/svelte-forms-lib/issues/159#issue-1163956097