單項數據綁定用“v-bind”指令，數據隻能從Vue實例的data屬性流向頁面，當data屬性值發生變化，頁面中對應的值也會随之變化，但頁面中的值變化，不會對data屬性值産生影響。
模闆容器和Vue實例
<body>
<div id="root">
<input type="text" v-bind:value="name">
<span>{{name}}</span>
</div>
</body>
<script>
new Vue({
el:'#root',
data:{
name:'百度'
}
})
</script>
修改input框内的值，Vue實例data中的name不會發生變化，因此span标簽内的值也不會發生變化
<body>
<div id="root">
<input type="text" :value="name">
<span>{{name}}</span>
</div>
</body>
<script>
new Vue({
el:'#root',
data:{
name:'百度'
}
})
</script>
雙向數據綁定用“v-model”指令，數據不僅能從Vue實例的data屬性流向頁面，還可以從頁面流向data屬性，當data屬性值發生變化，頁面中對應的值也會随之變化，反之頁面中的值變化，對應的data屬性值也會随之變化。
模闆容器和Vue實例
<body>
<div id="root">
<input type="text" v-model:value="name">
<span>{{name}}</span>
</div>
</body>
<script>
new Vue({
el:'#root',
data:{
name:'百度'
}
})
</script>
修改input框内的值，Vue實例data中的name值也會随之發生變化，從而引起span标簽内的值發生變化
<body>
<div id="root">
<input type="text" v-model="name">
<span>{{name}}</span>
</div>
</body>
<script>
new Vue({
el:'#root',
data:{
name:'百度'
}
})
</script>
注：雙向綁定一般都應用在表單類元素上，如input、select等。
,更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!
zpostcode 
Recruit 
weather 
mreligion 
Yellowpages 
sport 
constellation 
shopping 
name 
game 
directory 
literature 
Word 
tour 
furnish 
Lottery 
tftnews 
lyrics 
News 
digital 
car 
dir 
Edu 
Finance 
