undefined | Better HN

0 pointsfbonetti8y ago0 comments

How is that not two-way binding? The Vue documentation even calls it two-way binding:

“You can use the v-model directive to create two-way data bindings on form input and textarea elements.”

0 comments

2 comments · 1 top-level

ohceecho8y ago· 1 in thread

Yeah, the documentation should probably reflect that. It works like shallow two-way binding, but it implemented differently. Instead of using observers on the data itself, it uses an event, thus maintaining a cleaner interface between the components and avoiding the performance problems and bugs that come with two-way binding.

`v-model` is just a syntax sugar to save you from typing `v-bind:value="val" v-on:input="val = $event.target.value"` over and over. Nothing more than that.

dabernathy898y ago

V-model is great. For other folks reading this thread, a few things it lets you do:

1) You can still use v-model with Vuex: https://vuex.vuejs.org/en/forms.html

2) You can easily distribute custom components that provide `v-model` to users

3) You can dynamically accept 3rd party components that implement `v-model`. E.g., I have a component that incorporates standard form fields, but can also be used with any custom components that properly implement `v-model`.[1]

[1] - Vue Query Builder (https://dabernathy89.github.io/vue-query-builder/) - try adding a 'Range' rule to see this in action

1 more reply

j / k navigate · click thread line to collapse