<body>
<div id="app">
<h4>{{msg}}</h4>
<!-- v-bind 只能實現數據的單向綁定,從 M 自動綁定到 V,無法實現數據的雙向綁定 -->
<input type="text" :value="msg">
<!-- 使用 v-model 指令,可以實現表單元素和Model中數據的雙向數據綁定 -->
<!-- 注意:v-model 只能運用在表單元素中 input(radio, text, address, email...) select checkbox textarea -->
<input type="text" v-model="msg">
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
msg: '大家都是好學生',
},
methods: {},
})
</script>
</body>
介紹Vue的雙向數據綁定指令v-model
v-bind
:只能實現數據的單向綁定,從 M 自動綁定到 V,無法實現數據的雙向綁定v-model
:可以實現表單元素和Model中數據的雙向數據綁定v-model
注意事項:只能運用在表單元素中input(radio, text, address, email...) select checkbox textarea