<!--v-model 實現雙向數據綁定 其中一個值發生改變,另外一個值也將實時發生改變--> <div id="app09"> <h1>{{ message }}</h1> <input v-model="message" /> </div> 調用: Study_V_Model("#app09"); 實現 function Study_V_Model(obj) { new Vue({ el: obj, data: { message:'' } }) }
<!--number修飾符 限制只能輸入 數字--> {{ typeof(value) }}{{ value }}<input v-model.number="value"> <!--lazy 懶加載 文本框的內容輸完纔會更新值,不會實時的更新--> {{ typeof(value) }}{{ value }}<input v-model.lazy="value"> <!--trim 去掉首位的空格--> {{ typeof(value) }}{{ value }}<input v-model.trim="value"> <span> </div> <script> new Vue({ el:"#app01", data:{ message:'aaa', isActive: true, color:'red', value:1 } }) </script>