element-ui 表单自动验证问题的解决

element-ui 中的 el-form 组件自带了验证功能.当 表单初始化后,每次 赋值或进行 相应操作.就会触发 表单自动验证

在开发中,有一个不太友好的问题,就是 打开表单后,再打开 就会触发自动校验,报一片红.

目前有两种方案应对 :

1. 是 使用 v-if 控制表单,这样 第二次点开后 表单 无值,也不会触发表单自动校验.

缺点 是 v-if 太消耗性能,频繁使用 会导致 页面崩溃.

 

2.是 使用 el-form 自带的 方法 clearValidate 移除整个表单的校验结果,见 element Form Methods

缺点 是 只对 blur 事件 起作用,change 事件不起作用

 

3.这个正在研究中,不算应对方案

在表单 赋值操作前 移除校验规则,使 this.formRules = {},form 赋值后再加上 校验规则