elementui选择器多选时闪_elementUI中select下拉框设置了多选multiple之后 一进页面就触发校验bug...

问题描述 : 在elementUI中 , Form表单设置了rules校验规则 , 正常情况下 , 进页面是不会触发校验规则的 , 但是select下拉框设置了multiple 多选属性之后 , 就会产生bug . 原因是select下拉框设置多选属性之后 , 进页面就会触发change事件导致触发校验规则 , 如图

8e7a06e7cad8

bug现象

解决方案 :

1 . 在 created 钩子函数中 , 默认将绑定的值设置为空数组 this.$set(this.rowData, 'reason', [])  /* this.rowData为props接收的对象, reason是select下拉框v-model绑定的值 */

8e7a06e7cad8

解决方案1

2 . 其他同事的做法 , 设置一个data值 , 校验的时候去控制

8e7a06e7cad8

解决方案2

3 . 之前在网上看的方法 , 其实感觉不是很正确哈 , 应该是我水平低了 , 我写的时候 , 会发生其他的bug. 使用 this.$refs.editForm.resetFields() 在created中清空form表单的校验 , 注意要写在 nextTict中 , 方法比较暴力 , 确实可以将检验关闭 , 但是我这边产生了bug , 就是其他的input输入框 , 不能渲染输入的内容 , 每次输入的内容都会被清掉 ... 有兴趣的可以研究一下 , 然后给我留言哦 ~

8e7a06e7cad8

未解决bug的方案

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值