一、單向數(shù)據(jù)綁定

<div id="root"><!-- 僅僅只是綁定一個(gè)屬性在標(biāo)簽上 只有 data 變化，輸入框才會(huì)變化 -->數(shù)據(jù)單向綁定：<input type="text" name="" id="" :value="name"> </div> <script src="../js/vue.js"></script> <script>Vue.config.productionTip = false;new Vue({el: '#root',data: {name: '張三'}}) </script>

二、雙向數(shù)據(jù)綁定

<div id="root"><!-- 輸入框和data中的數(shù)據(jù)任意一邊改變數(shù)據(jù)都會(huì)同步發(fā)生變化 -->數(shù)據(jù)雙向綁定：<input type="text" name="" id="" v-model="name"> </div> <script src="../js/vue.js"></script> <script>Vue.config.productionTip = false;new Vue({el: '#root',data: {name: '張三'}}) </script> <!--備注：1. 雙向綁定一般都應(yīng)用在表單類元素上，如（input、select等）2. v-model:value 可以簡(jiǎn)寫(xiě)成 v-model，因?yàn)?v-model 默認(rèn)收集的就是 value 的值 --> 創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的Vue数据绑定v-bind的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。