3 ms·
>And VueJS employs two-way binding Two way binding is an anti-pattern in Vue. https://vuejs.org/v2/guide/components.html#One-Way-Data-Flow https://vuejs.org/v2
by ElatedOwl 9y ago
>And VueJS employs two-way binding
Two way binding is an anti-pattern in Vue.
https://vuejs.org/v2/guide/components.html#One-Way-Data-Flow https://vuejs.org/v2/guide/components.html#One-Way-Data-Flow
You actually get console warnings if you try to affect state in that manner.
- luord 9y agoThat's about parent and child components, not about the state of a particular component. VueJS keeps two way data-binding between the template and the component; react does not and needs to handle events from jsx (or whatever one is using as template) explicitly. And making child controllers directly alter the state of their parents is generally thought as an anti-pattern in angular 1 too, as far as I understand.
- ElatedOwl 9y agoThanks for the clarification but I'm still a little confused. >VueJS keeps two way data-binding between the template and the component In what sense? If you need to update your data on the JS side from the DOM you have to use events. There's v-model, but this is just syntax sugar for binding an event on input to update the value prop.
- luord 9y ago> In what sense? If you need to update your data on the JS side from the DOM you have to use events. There's v-model, but this is just syntax sugar for binding an event on input to update the value prop. Which is why calling two-way data binding in js a "bug" is so weird (for lack of a better word). In angular, two-way data binding is, ultimately, also syntactic sugar over DOM events. For that matter, everything every frontend framework provides is syntactic sugar over vanilla javascript.
- ElatedOwl 9y agoAll I'm saying is that Vue doesn't do two way binding. v-model translates directly into a DOM event, ie <input v-model="someProp"> is equivalent to <input v-bind:value="someProp" v-on:input="someProp = $event.target.value"> Which, as far as I understand, is exactly how React handles it and is deemed one way binding. ¯\_(ツ)_/¯
- luord 9y agoWe seem to be about to start going in circles so I'm cutting here with one last remark: For what it's worth, in Angular one can also make the events explicit, and yet in there it is called two way binding.