Re:Vue.js: the good, the meh, and the ugly
by kevin_thibedeau on Thursday July 05, 2018 @10:59PM
(#17468546)
"v-model" is syntax sugar emulating a two-way binding to simplify form creation. Under the hood it's a one-way bound prop, an event, and an implicit event handler. Ordinary events can't mutate state without an explicitly created handler.
All props form a one-way-down binding between
the child property and the parent one: when the
parent property updates, it will flow down to
the child, but not the other way around. This
prevents child components from accidentally
mutating the parent’s state, which can make
your app’s data flow harder to understand.
https://vuejs.org/v2/guide/components-props.html#One-Way-Dat... AngularJS uses two-way binding between scopes,
while Vue enforces a one-way data flow between
components. This makes the flow of data easier
to reason about in non-trivial applications.
https://vuejs.org/v2/guide/comparison.html#Data-binding
Re:Vue.js: the good, the meh, and the ugly
by orangecat on Thursday July 05, 2018 @08:12PM
(#17467956)
As discussed in https://vuejs.org/v2/guide/components.html#Using-v-model-on-...
<Component v-model="foo">
is basically shorthand for <Component :value="foo" @input="foo=$event">
In particular, the child can't affect the value of the parent's "foo" attribute except by sending an event. This is in contrast to Angular 1 where changing "foo" in the child would also change it in the parent, which would often lead to confusing data flow cycles.
> "You can use the v-model directive to create two-way data bindings on form input and textarea elements. It automatically picks the correct way to update the element based on the input type. Although a bit magical, v-model is essentially syntax sugar for updating data on user input events, plus special care for some edge cases."
I'm not knowledgeable enough on the matter to say if this is or isn't, and to compare vs Angular, etc. But don't blame the author for this one ¯\_(ツ)_/¯
[1] https://vuejs.org/v2/guide/forms.html