Vue-V-model引數繫結
Vue框架很核心的功能就是雙向的資料繫結。
雙向是指：Vue 物件的改變會直接影響到 HTML 的標籤的變化，而且標籤的變化也會反過來影響 Vue 物件的屬性的變化。
v-model 指令用來在 <input> 、 <select>、 text、 checkbox、radio 等表單控制元件元素上建立雙向資料繫結
1，
例子：
<body>
<div id="app">
<span>文字輸出到這裡：</span>
<p style = 'white-space:pre-line'>{{message}}</p>
<br>
<textarea v-model = 'message' placeholer = '請在此輸入文字'></textarea>
</div>
<script type="text/javascript" src="js/vue-resource.js" ></script>
<script type="text/javascript" src="js/vue.min.js" ></script>
<script>
var vm = new Vue({
el: '#app',
data: {
message: 'Vue 很強大！',
},
});
</script>
</body>
當改變文字框的內容時，上面的一行資料也會改變
例子2，
v-model 會忽略所有表單元素的 value、checked、selected 特性的初始值。因為它會選擇 Vue 例項中的資料來作為具體的值
當interest為空字串時,點選某一個複選框,預設三個複選框都會被選中,返回的值時 true 或者false
例子3
例子4
v-model 指令後還可以新增多個引數 （number、lazy、debounce）;
lazy
-
在預設情況下，v-model 在 input 事件中同步輸入框的值與資料，我 們們可以新增一個 lazy 特性，從而將資料改到 change 事件中發生
-
使用 lazy 引數是將雙向資料同步的時間節點從 input 觸發改為了 change 觸發
2. number
- 當傳給後端的欄位型別必須是數值的時候，我們可以在 v-model 所在的控制元件上使用 number 指令，該指令會在使用者輸入被同步到model 中時將其轉換為數值型別
- 如果原值的轉換結果為 NaN,則返回原值
該文章轉載https://blog.csdn.net/WinSolstice/article/details/75172253