如何实现双向绑定呢?一起来看看吧
正文
html代码
<Input v-model="value" placeholder="Enter something..." style="width: 100px" />
script
data:{ list:[], inputValue:'', value: '' }, methods:{ handleBtnClick:function(){ this.value="哈哈" } }
效果图
点击之前
点击之后
分析
v-model在我看来就是在一个控件里等于这个控件中内置属性,然后可以在data中给其赋值,就会让控件显示初值。如果在方法中赋值的话,就会让控件显示赋值的值。另外,双向的意思就是当控件中的值发生改变,那么方法中的值也会改变。
深化
那么如果不是在控件中,在div等标签中如何使用呢?
其实和在控件中是一个道理
html文件
<div v-model="value">{{value}}</div>
script
handleBtnClick:function(){ this.value="哈哈" }
效果图
点击前
点击之后
小结
理解的有不到位的地方欢迎大家指出