5.v-model

<div id="test1">
    <input type="text" v-model.lazy="apple">
    <pre>{{apple}}</pre>
    <input type="text" v-model.trim="peach">
    <pre>{{peach}}</pre>
    <input type="text" v-model.number="orange">
    <pre>{{orange}}</pre>
</div>

new Vue({
   el:'#test1',
   data:{
       apple:null,
       peach:null,
       orange:null,
   }
});

    number可以使字符变成数字

input,textarea,select标签可以使用v-model

<div id="test2">
    <label>
    男<input v-model="sex" value="male" type="radio">
    </label>
    <label>
    女<input v-model="sex" value="female" type="radio">
    </label>
    <br>
    <span>性别是 {{sex}}</span>
    <hr>
    <br>
    喜欢吃：
    <br>
    <label>
    馒头<input v-model="food" value="steambread"  type="checkbox">
    </label>
    玉米<input v-model="food" value="corn" type="checkbox">
    大饼<input v-model="food" value="pancake" type="checkbox">
    <br>
         喜欢:{{food}}
    <hr>
    喜欢在哪吃：
    <select v-model="place" multiple>
        <option value="1">家</option>
        <option value="2">店</option>
        <option value="3">街头</option>
        <option value="4">学校</option>
    </select>
</div>

var t2=new Vue({
   el:'#test2',
   data:{
       sex: 'male',
       food:[],
       place:2,
   }
});