在 vue 2.6.10 版本遇到了 首次进行编辑input 可以正常输入 但是再次进入不能正常输入,是因为我对input绑定的是对象内的变量,首次进入关闭之后我进行了对象的重置直接置为空对象,这样会导致这种错误的发生;
//template <el-input v-model="myObj.input1"/> <el-input v-model="myObj.input2"/> //data里的数据 myObj:{ input1:"", input2: "", } //methods中在关闭时进行重置 reset 这种重置方式 导致上面的问题 reset(){ myObj:{} }
解决方法:
方案1:重置时 精确到对应的变量
reset(){ myObj:{ input1:"", input2: "", } }
方案2:给input绑定@input事件 有内容输入就实时更新视图
<el-input v-model="myObj.input1" @input="updateView($event)" /> <el-input v-model="myObj.input2" @input="updateView($event)" /> //methods updateView(e) { this.$forceUpdate() }
方案3:绑定到input中的双向数据变量 不是对象内部的值就不会遇到这个问题
<el-input v-model="input1" @input="updateView($event)" /> <el-input v-model="input2" @input="updateView($event)" /> //data input1: "", input2: ""
参考:https://www.cnblogs.com/xhliang/p/11940418.html