有时候输入框会复用但是初始v-model绑定的内容会根据业务需求改变,例如下面点击按钮控制老师、学生信息切换:
<!-- 正确的写法 -->
<input v-model="(flag ? student:teacher).name" />
<input v-model="(flag ? student:teacher).age" />
<!-- 错误的写法 -->
<input v-model="flag ? student.name:teacher.name" />
<input v-model="flag ? student.age:teacher.age" />
<button @click="flag = !flag">老师学生切换</button>
data(){
return{
flag: true,
student:{
id: 20161001,
name: "小敏",
age: 19
},
teacher:{
id: 19981002,
name: "老王",
ge: 39
}
}
}