解决vue中v-model双向绑定失败,表单数据不能回显的问题
解决vue中v-model双向绑定失败,表单数据不能回显的问题在vue中使用v-model="columns[i].value"或v-model="column[value]"进行双向绑定时或者在绑定事件中使用赋值形式改变绑定变量的值如:handleChange(value){switch (value){case 1:this.Model.value=600;this.Model.Precisi
·
解决vue中v-model双向绑定失败,表单数据不能回显的问题
在vue中使用v-model="columns[i].value"
或v-model="column[value]"
进行双向绑定时或者在绑定事件中使用赋值形式改变绑定变量的值如:
handleChange(value){
switch (value){
case 1:this.Model.value=600;this.Model.Precision=0;break;
case 2:this.Model.value=10;this.Model.Precision=0;break;
case 3:this.Model.value=10;this.Model.Precision=10;break;
case 4:this.Model.value=1;this.Model.Precision=0;break;
case 5:this.Model.value=0;this.Model.Precision=0;break;
}
}
可能会导致v-model双向绑定出错,数据错误显示但绑定变量数据正确。
这时可以使用this.$set(对象,属性,值)方法给v-model绑定的变量重新赋值,可以解决这个问题。具体使用方法如下:
<a-input v-model="Model.value" @change="onChange"/>
//此处的Model.value双向绑定存在问题,使用onchange方法修复
修复方法:
onChange(e){
this.$set(this.Model, this.Model.value, e)
},
更多推荐
已为社区贡献1条内容
所有评论(0)