前面我讲了V-bind指令,该指令只能实现数据的单向绑定,从M自动绑定到V,无法实现数据的双向绑定。不能将数据传回mv控制的m中,也就是不能将数据传回逻辑层。这样前端和逻辑层便不能进行数据交互。为解决此问题,v-model指令应运而生。v-model指令,可以实现表单元素和Model中数据的双向数据绑定。
下面是我写的例子,当text中的内容改变的时候,h4标签中的内容也会随之改变
<h4>{{msg}}</h4>
<input type="text" v-model:value="msg" style="width:100%;">
可以在控制台输入Windows.vue名字 查看vue
vue中msg的值也会随之改变,这样改变的值就会传回vue,逻辑代码就可以根据变化从而进行一些操作。