智讯网 智能科技与电子数码

v-model双向绑定原理

v-model双向绑定原理 

v-model是Vue的双向绑定指令,它能将页面上控件输入的值同步更新到相关绑定的data属性,也会在更新data绑定属性时候,更新页面上输入控件的值。

v-model的原理主要依赖于Object.defineProperty(),通过这个函数可以监听到get,set事件。v-model主要提供了两个功能,view层输入值影响data的属性值,data属性值发生改变会更新view层的数值变化。

在表单元素上做了事件监听(监听input、change事件),如果值发生变化时,在事件回调函数把最新的值设置到vue的实例上,因为vue的实例已经实现了数据的响应化,它的响应化的set函数会触发,通知界面中所有模型的依赖的更新,所以界面中的,跟这个数据相关的部分就更新了。

版权说明:文章均为账号作者发布,不代表本网站观点与立场,如有侵权请联系我们删除