v-model:綁定數(shù)據(jù)源啡专。就是把數(shù)據(jù)綁定在特定的表單元素上冲杀，可以很容易的實(shí)現(xiàn)雙向數(shù)據(jù)綁定。
一身堡、最簡(jiǎn)單的雙向數(shù)據(jù)綁定
<div id="app">
<h1>原始信息：{{msg}}</h1>
</div>
<script>
var app=new Vue({
el:"#app",
data:{
msg:"hello",
}
})
</script>
二邓尤、修飾符
.lazy：取代 imput 監(jiān)聽 change 事件。
.number：輸入字符串轉(zhuǎn)為數(shù)字贴谎。
如果一開始輸入的是字符汞扎，不是數(shù)字，并不會(huì)起作用
.trim：輸入去掉首尾空格擅这。
<p>v-model:lazy<input type="text" v-model.lazy="msg"></p>
<p>v-model:number<input type="text" v-model.number="msg"></p>
<p>v-model:trim<input type="text" v-model.trim="msg"></p>
三澈魄、文本域加入數(shù)據(jù)綁定
<h1>文本域：</h1>
<textarea cols="10" rows="10" v-model="msg"></textarea>
<script>
var app=new Vue({
el:"#app",
data:{
msg:"hello",
isTrue:true,
names:[],
sex:'男'
}
})
</script>
四、多選按鈕綁定一個(gè)值
<h1>多選框綁定一個(gè)值</h1>
<input type="checkbox" id="isTrue" v-model="isTrue">
<label for="isTrue">{{isTrue}}</label>
五仲翎、多選綁定一個(gè)數(shù)組
<p>
<input type="checkbox" id="jian" v-model="names" value="jian">
<label for="jian">jianjian</label>
<input type="checkbox" id="lili" v-model="names" value="lili">
<label for="lili">lili</label>
<p>{{names}}</p>
</p>
六痹扇、單選按鈕綁定
<h1>單選框綁定</h1>
<p>
<input type="radio" id="male" value="男" v-model="sex">
<label for="male">男</label>
<input type="radio" id="female" value="女" v-model="sex">
<label for="female">女</label>
<p>選的是:{{sex}}</p>
</p>
<script>
var app=new Vue({
el:"#app",
data:{
msg:"hello",
isTrue:true,
names:[],
sex:'男'
}
})
</script>
加油啊溯香！今天吃狗糧鲫构，明天除夕了，希望在新年來前把這個(gè)學(xué)完了玫坛，心好累结笨，某些人，愛咋咋地，不奉陪了炕吸，不想當(dāng)炮灰和接盤俠伐憾，就醬！
