一、v-bind
使用v-bind进行数据绑定只能实现单向流动,即只能通过改变data中的数据来改变页面数据,而不能实现从页面流向data
<div id="root">
<input type="text" v-bind:value="msg">
</div>
<script>
new Vue({
el:'#root',
data(){
return{
msg:'单向流动'
}
}
})
二、v-model
使用v-model进行数据绑定时是双向流动的,即能够通过改变data中的数据来改变页面数据,也能通过改变页面中的数据来改变data数据。但是v-model只能绑定具有value属性的标签,一般绑定在表单元素上
<div id="root">
<input type="text" v-model:value="msg">
</div>
<script>
new Vue({
el:'#root',
data(){
return{
msg:'双向流动'
}
}
})
</script>