Vue双向数据绑定指令——v-mode

前面我讲了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,逻辑代码就可以根据变化从而进行一些操作。
在这里插入图片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章