elementui el-form自定义校验规则后表单验证this.$refs[formName].validate不生效的问题

解释：

在使用Element UI的el-form组件进行表单验证时，如果你自定义了验证规则，并通过this.$refs[formName].validate方法触发验证，但是验证不生效，可能的原因是你的自定义规则没有正确实现或者没有按照Element UI要求的方式调用。

解决方法：

1. 确保你的自定义验证规则是一个函数，并且接收两个参数：rule, value，其中rule是验证规则的详细信息，value是表单项的值。
2. 在你的规则函数中，你需要通过调用callback函数来返回验证结果。如果验证失败，你应该调用callback(new Error('message'))；如果验证成功，则调用callback()。
3. 确保你在模板中绑定的prop属性值与el-form-item的label属性值相对应，它们是用来进行表单验证的关键。

示例代码：

// 自定义验证规则
const validatePass = (rule, value, callback) => {
  if (value === '') {
    callback(new Error('请输入密码'));
  } else {
    if (this.form.checkPass !== '') {
      this.$refs.form.validateField('checkPass');
    }
    callback();
  }
};
 
// 在data中定义表单数据和验证规则
data() {
  return {
    form: {
      pass: '',
      checkPass: ''
    },
    rules: {
      pass: [
        { validator: validatePass, trigger: 'blur' }
      ],
      checkPass: [
        { validator: (rule, value, callback) => {
            if (value === '') {
              callback(new Error('请再次输入密码'));
            } else if (value !== this.form.pass) {
              callback(new Error('两次输入密码不一致!'));
            } else {
              callback();
            }
          }, trigger: 'blur' }
      ]
    }
  };
},
 
// 在methods中调用验证
methods: {
  submitForm(formName) {
    this.$refs[formName].validate((valid) => {
      if (valid) {
        alert('验证通过!');
      } else {
        console.log('验证失败!');
        return false;
      }
    });
  }
}

在上面的代码中，validatePass是一个自定义的验证规则函数，它通过调用callback来返回验证结果。在data中定义了表单数据和对应的验证规则，在methods中通过this.$refs[formName].validate触发表单验证。