el-form-item校验问题

场景

表单中,有的校验元素不是标准的输入框,如:



这种场景下,el-form-item上prop指定的值已经变化后,不会触发重新校验,导致选中之后,错误信息不消失

原因

跟踪el的源码,发现原因是,el自己的表单输入元素在值改变后,会触动去触发上层的el-form-item组件的
‘el.form.change’事件,el-from-item接收到此事件后,会重新校验

解决方法

对需要特殊输入组件的绑定值,进行watch,监听到变化后,用代码去触发上层el-form-item的‘el.form.change'事件

  1. 在组件上为el-from-item添加ref

          选择
          查看征信报告
          变更征信报告
        
  1. 监听值的变化
'applyModel.creditReportId'(){
      this.$refs.creditReportItem.$emit('el.form.change'); //非el的输入组件,值变化时不会触发el-from-item的重新校验,需要手动触发el.form.change事件
    }

注意:
这个值的rule中,trigger必须是change

你可能感兴趣的:(el-form-item校验问题)