v-model是什么?怎么使用?

v-model用于表单数据的双向绑定,其实它就是一个语法糖,这个背后就做了两个操作:

v-bind绑定一个value属性
v-on指令给当前元素绑定input事件
在这里插入图片描述
v-model很好地体现了vue双向绑定的理念。
单向绑定非常简单,就是把Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新。有单向绑定,就有双向绑定。
如果用户更新了View,Model的数据也自动被更新了,这种情况就是双向绑定。
什么情况下用户可以更新View呢?填写表单就是一个最直接的例子。当用户填写表单时,View的状态就被更新了,如果此时MVVM框架可以自动更新Model的状态,那就相当于我们把Model和View做了双向绑定。
双向数据绑定=单向数据绑定+UI事件监听

当然v-model深挖的话,还有很多修饰符之类的:
v-model详解

Logo

前往低代码交流专区

更多推荐