关于网上大量对Vue双向绑定的错误理解

对于Vue的双向绑定，现在基本是个前端都听说过，面试官也喜欢问这个问题。但对于Vue双向绑定的原理，掘金、博客园和segmentfault等技术社区充斥着大量的错误文章。这些文章的题目基本样子如下 “面试题：如何实现Vue的双向绑定”或“Vue源码解读：Vue双向绑定原理”，文章里写的Vue 2.0双向绑定原理都是Object.defineproperty通过get和set来劫持实现。这种文章这不仅仅给前端开发者造成了误导，就连很多面试官也是这么认为的。

为了遏制这种错误知识的传播，Vue作者尤雨溪亲自在Vue文档进行了说明，解释什么是Vue的双向绑定:你可以用 v-model 指令在表单 <input> 、 <textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。

这里大家就了解了，Vue的双向绑定是指表单元素的v-model指令，而v-model只是个语法糖而已。MVVM架构模式在View层更改的时候会触发Model层更改，若Vue仅仅用Object.defineproperty自身是没有办法对{{}}里的数据进行View层的改变的。那广为流传的Object.defineproperty是做什么的呢？Object.defineproperty是Vue3.0之前版本的核心，Vue通过它的set和get进行数据劫持从而实现数据的响应式更新。而我们要对View层的改变，需要的就是v-model这些输入框等表单元素进行View层更改。希望今后能少一些对于双向绑定原理错误理解的文章了。