elemen-ui中的input框无法删除并修改的解决方法

<el-form-item prop="billNo" label="号码1"> <el-input width="180px" v-model="modelForm.billNo"></el-input> </el-form-item>

解决办法:

方法1. el-input value属性修改为使用v-model


方法2. 使用input事件,实时刷新,两种方法本质其实是相同的。

<el-form-item prop="" label="号码2"> <el-input width="180px" :value="modelForm.billNo2" @input="modelForm.billNo2 = $event" ></el-input> </el-form-item>


方法3. 看前辈有推荐 通过input事件和this.

在change事件中执行 this.$forceUpdate()强行刷新视图。已验证有效

<el-form-item prop="" label="号码3"> <el-input width="180px" :value="modelForm.billNo3" @input="change($event)" ></el-input> </el-form-item>

总结

这种问题产生原因是input在vue中受控导致,(elementUI官方文档也有说明)我们需要重新改变一下监听和实现,所以个人还是推荐使用v-model,用起来简单省事。


转载自:el-input无法输入的问题 解决 - 简书 (jianshu.com)

感谢大神分享

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

相关阅读更多精彩内容

友情链接更多精彩内容