[TOC] ## v-model 1. 推荐表单元素绑定到一个 form 对象 2. checkbox 需要显示设置 form.xxx 为数组 3. v-model 的好处是直接可以获取 radio 或者 checkbox 的value值 4. v-model 在对数据显示radio 或checkbox 时绑定 form.xxx 对象,可以直接显示对象的值 v-model 实现方式 ``` <input type="text" v-model="message"> 等同于 <input type="text" v-bind:value="message" v-on:input="message = $event.target.value"> ``` 实例 ``` <input type="text" v-model="form.message"> <div>{{form.message}}</div> <div> <label for="male"> <input type="radio" value="男" v-model="form.male"> <input type="radio" value="女" v-model="form.male"> </label> </div> <div> <label for="love"> <input type="checkbox" value="eat" v-model="form.love"> <input type="checkbox" value="running" v-model="form.love"> </label> </div> <div> <select name="job" id="" v-model="form.select"> <option value="医生">医生</option> <option value="學生">學生</option> <option value="學生1">學生1</option> </select> </div> <input type="button" value="按钮" @click="btn"> </div> // js data() { return { myArray: [{id:1, name: 'aa'}], myArray2: [], form:{ love:[] } } }, methods: { btn(){ console.log(this.form); // {"love":["running","eat"],"male":"女","message":"33434","select":"學生"} } } ```