购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

4.1 实现双向数据绑定

对于数据的绑定,无论是使用插值表达式({{}})还是v-text指令,对于数据间的交互都是单向的,只能将Vue实例中的值传递给页面,页面对数据值的任何操作都无法传递给model。

MVVM模式最重要的一个特性,可以说是数据的双向绑定,而Vue作为一个MVVM框架,肯定也实现了数据的双向绑定。在Vue中使用内置的v-model指令完成数据在View与Model间的双向绑定。

可以用v-model指令在表单<input>、<textarea>及<select>元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇,但v-model本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。

v-model会忽略所有表单元素的value、checked、selected特性的初始值,而总是将Vue实例的数据作为数据来源。这里应该通过JavaScript在组件的data选项中声明初始值。 ZWATUOWtCOQ3m6WJg3a1X6g/DH3JZwSj0hFg5s1Yedt5qz7H6JhXuofsfKZQ4e34

点击中间区域
呼出菜单
上一章
目录
下一章
×