element-ui表单校验validator的使用

当校验规则复杂时,可把校验抽离出去

data () {
    const validateCode = (rule, value, callback) => {
      // 1. 拿到所有的原始节点数据  allList
      // 2. allList里面每一项的code码拿到组成一个新数组
      const codeList = this.allList.map(item => item.code)
      if (codeList.includes(value)) {
        return callback(new Error('当前code码重复'))
      } else {
        callback() //ballback回调一定要执行
      }
    }
    return {
      rules: {
        // 添加自定义校验函数
        code: [
          { required: true, message: '部门编码不能为空', trigger: ['blur', 'change'] },
          { min: 1, max: 50, message: '部门编码要求1-50个字符', trigger: ['blur', 'change'] },
          { validator: validateCode, trigger: 'blur' } //当校验规则复杂时,可把校验抽离出去
        ]
      }
    }
  }