关于el-input获取v-model绑定的数据后输入无效

案例:表单中的某一个<el-input v-model="formdata.pwd">,在后端获取详情后,此项输入无效。检查原因如下:

首先,获取详情中没有pwd字段,所以formdata获取之后又单独写了this.formdata.pwd = '123'

自信查看错误后发现,@input事件输入是有值的,打印formdata.pwd也是有值的。于是定位原因是视图为更新。

定位错误原因后,忽然发现formdata初始化是空对象,所以pwd字段是相当于后面新添的数据项,vue视图是监测不到更新的。

解决办法:

1.最简单的办法:先重新构建获取详情后的对象,将pwd加入其中。然后直接赋值给formdata,这样相当于修改formdata,是可以检测到视图更新的

2.或者在el-input中添加@input事件,并强制更新视图

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容