vue学习(七) v-model 双向数据绑定

//html

<div id="app">

　　　　<input type="text"v-model="msg" style="width:100%">

</div>

//script

<script>

　　var vm = new Vue({

　　　　el:'app',

　　　　data:{

　　　　　　msg:'点击一下'

　　　　}

　　})

</script>

说明：

v-bind只能实现数据的单向绑定从model 自动绑定到 view中，无法实现数据的双向绑定

v-model指令可以实现表单元素和model中数据的双向绑定 v-model只能运用在表单元素中，即除了能够实现数据从model渲染到到view，也能实现从view中道model中去

效果：

页面渲染完成之后，会有一个点击一下和一个input，input的内容是点击一下修改input中的值，页面上的点击一下会随着input内容的变化而变化

巴特西

vue学习(七) v-model 双向数据绑定

最新文章

热门文章