200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > vue文本输入框v-model双向绑定手动赋值后文本框中数据不实时显示的问题

vue文本输入框v-model双向绑定手动赋值后文本框中数据不实时显示的问题

时间:2023-07-06 18:46:19

相关推荐

vue文本输入框v-model双向绑定手动赋值后文本框中数据不实时显示的问题

项目中遇到一个问题,使用vue双向绑定对象的属性,但是手动给属性赋值后输入框中的数据不实时显示。

场景如下: 选择一条生产线后,自动按顺序生成一个新的库位码,并将新的库位码显示在文本框中,但是将新生成的库位码赋值给文本框时,文本框中并没有实时显示。

<el-row :gutter="24"><el-col :span="24"><el-form-item prop="locationName" label="库位名称:"><el-input v-model="form.locationName" placeholder="请输入名称" style="width: 80%" clearable disabled /></el-form-item></el-col></el-row><el-row :gutter="24"><el-col :span="24"><el-form-item prop="binLocationBarcode" label="库位码:"><el-inputv-model="form.binLocationBarcode"placeholder="请输入库位码"style="width: 80%"clearabledisabled/></el-form-item></el-col></el-row>

手工赋值后,对象的值并没有实时显示在文本框中

// 手工给对象属性赋值,但是输入框中并没有实时显示,// 而是进行了其他操作后才显示文本框中的赋值数据this.form.locationName = res.data.newBinLocationNamethis.form.binLocationBarcode = res.data.newBinLocationBarcode

解决方法:使用$set(object,“prop”,value)方法设置属性的值就显示了

this.$set(this.form, 'locationName', res.data.newBinLocationName)this.$set(this.form, 'binLocationBarcode', res.data.newBinLocationBarcode)

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。