學習要點：
1.值綁定
2.修飾符
本節課我們來開始學習 Vue3.x 的表單中 value 值的綁定和修飾符功能。
一．值綁定
1. 使用 v-model 操作 input 等，是直接操作和綁定 value 值的；
2. 但是對于 checkbox 等表單，是操作它的 checked 等首選項的；
3. 所以，此時我們需要對這些表單元素的 value 值進行綁定操作；
<input type="checkbox" id="checkbox" v-model="checked">
<div>{{checked}}div>
return {
checked : true
}
PS：雖然可以進行雙向綁定切換，但本質上這個 checkbox 并沒有 value 值；
PS：我們可以通過控制臺查看器觀察，此時我們還需要進行值綁定操作；
<input type="checkbox" id="checkbox" v-model="checked"
v-bind:value="checked">
PS：單選框，下拉框均可以使用這種方法給 value 賦值；
二．修飾符
1. 有時我們不需要數據綁定的時候逐個觸發，可以使用.lazy 修飾符；
<input type="text" v-model.lazy="message">
{{message}}
2. 使用.number 修飾符將輸入的內容轉換為 number 數值類型；
<input type="text" v-model.number="number" type="number">
{{typeof number}}
3. 使用.trim 清理掉內容左右的空格；
<input type="text" v-model.trim="message">
本文由:蘭州啟點網絡（
www.syzhibo.net)整理發布!
啟點CMS演示地址及賬號
