前提概要
- 使用的弹出框包的，el-form和el-transfer。
- 使用的el-form包裹的el-transfer。
- el-transfer使用的可搜索功能。
症状表现
el-transfer在页面弹出，加载的时候，触发了校验。如下图：此时的触发方式是change
校验规则如下：
rules = { xxxx: [{ type: 'array', required: true, message: '请选择xxxx', trigger: 'change'}]}
症状原因
表面原因
- 校验的规则选择的触发方式是change。
- 排除了和业务相关的代码。
- 使用官网的示例，也是可以复现。
深入探究
- el-transfer组件的this.dispatch('QFormItem', 'el.form.change', val);
- el-form的rules规则
对症下药
目前的处理方法是：触发方式修改为blur；在el-transfer，change的时候，调用表单的validate方法。
触发方式修改为blur，防止弹出框触发表单校验。change的时候，调用表单的validate方法，是为了处理错误信息。 上代码：
// xxx必填校验处理
const handleChange = () => {
_this.$refs.form.validate();
};
其他参考方案
总结
还是没有找到最后的原因，这只是一个临时的解决办法。
