只要是表單元素，其值已經不會再用value來定義了，但是placeholder還是可以用來設置默認值。
section1--input：type="text"
type="text"不要在標簽上定義value值（因為vue已經處理了），要用v-model="currentValue"
data:{currentValue:"xxx"}
<input type="text" v-model="currentValue"/>
// input顯示結果: xxx
section2--radio:
type="radio"的選中狀態不是根據checked來選中的，而是在data中定義一個屬性，且讓屬性的值等於value的值，就會被選中了。(反過來，如果選中了，則v-model = value)
data:{currentValue:"red"}
point: 以下兩個radio 用同一個v-model="currentValue"表明是同一組。
<input type="radio" v-model="currentValue" value="red"/>
<input type="radio" v-model="currentValue" value="green"/>
// value= currentValue 的值后，rodio就會選中，其他的radio都不會選中。
使用v-bind：
<input type="radio" v-model="pick" v-bind:value="a">
// 當選中時
vm.pick === vm.a
section3--textarea:
與type=text差不多一樣
section4--checkbox:
point 1:通過預設一個boolean值來控制多選，當我們點擊時，vue會根據v-model設定的true false對應取反，過程我們看不見的。
e.g:這是一種不設置value屬性的用法 ，其實checkbox原生應用中也是可以設置value的
data:{checked :true} //這里的checked是boolean
<input type="checkbox" id="checkbox" v-model="checked">
<label for="checkbox">{{ checked }}</label>
point 2:click后checked的值vue會自動取反。
more exercise:設置checkbox中的value值，點擊后通過v-model就會把value添加到數組上，value不設置就是null.
記得上面的value一定要設置，否則是null。
data：{toggle：true(可為任意值)}
point3--checkbox中的true-value = "yes2"自帶屬性 ，當用戶點擊的時候,vm.toggle === yes2
<input
type="checkbox"
v-model="toggle"
true-value="yes2"
false-value="no2"
>
section5--select:
有兩種：1是普通的data中定義的屬性用string類，即：v-model="'string'"，2.多選的要在元素上加一個multiple屬性，v-model="[]",其它的都跟原生用法差不多。
e.g:
data:{ selected:[] }
<select v-model="selected" multiple style="width: 50px;">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
<span>Selected: {{ selected }}</span>
result:
ctrl + 左擊：會將所有option的text添加到selected數組中。
select 原生使用：
<select>
<option value ="volvo">Volvo</option>
</select>
///////////////使用v-bind:///////////////////
<select v-model="selected">
<option v-bind:value="{mname:'tcc'}"></option>
</select>
則：vm.selected = {mname:'tcc'}
vm.selected .mname = "tcc"
---------------------
作者：tangchangcai.
來源：CSDN
原文：https://blog.csdn.net/tangcc110/article/details/80181401
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！