表单校验，常见的

<el-form ref="form" :model="form" :rules="rules" label-width="90px" class="readonly-field"></el-form>

校验

// 密码校验
const checkoutPassword = (rule, value, callback) => {
  const ipRules = /^(?=.*?[a-zA-Z])(?=.*?[0-9])(?=.*?(_|[^\w\s])).{6,20}$/
  if (!ipRules.test(value)) {
    callback(new Error('密码长度必须介于6-20位，且必须包含数字、字母以及特殊字符！'))
  } else {
    callback()
  }
}

// 确认密码校验
const checkoutRePassword = (rule, value, callback) => {
  const password = document.getElementById("password").value;
  // console.info('*****this.form.password*****', password)
  if (value === undefined || value === '') {
    callback(new Error('请输入确认密码'))
  }
  if (value && password && value.trim() !== password.trim()) {
    callback(new Error('两次输入密码不相同，请重新输入。'))
  }
  callback()
}

// 邮箱校验
const checkoutEemail = (rule, value, callback) => {
  // const ipRules = /^([a-zA-Z\d][\w-]{2,})@(\w{2,})\.([a-z]{2,})(\.[a-z]{2,})?$/
  // if (!ipRules.test(value)) {
  //   callback(new Error('请输入正确的邮箱！'))
  // } else {
  //   callback()
  // }
  const reg =/^([a-zA-Z0-9]+[-_.]?)+@[a-zA-Z0-9]+.[a-z]+$/;
  if(value==''||value==undefined||value==null){
    callback();
  }else{
    if (!reg.test(value)){
      callback(new Error('请输入正确的邮箱'));
    } else {
      callback();
    }
  }

}

// 身份证校验
const checkoutIdCord = (rule, value, callback) => {
  const ipRules = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
  if (!ipRules.test(value)) {
    callback(new Error('请输入正确的身份证号！'))
  } else {
    callback()
  }
}


data(){
return: {

rules: {
        orgName: [
          { required: true, message: '归属单位不能为空', trigger: 'blur' },
          // { min: 2, max: 20, message: '用户名称长度必须介于 2 和 20 之间', trigger: 'blur' }
        ],
        name: [
          { required: true, message: '用户名不能为空', trigger: 'blur' }
        ],
        loginName: [
          { required: true, message: '登录名不能为空', trigger: 'blur' }
        ],
        password: [
          { required: true, message: '用户密码不能为空', trigger: 'blur' },
          { validator: checkoutPassword, trigger: 'change' }
          // { min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
        ],
        rePassword: [
          { required: true, message: '用户密码不能为空', trigger: 'blur' },
          { validator: checkoutRePassword, trigger: 'change' }
          // { min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
        ],
        email: [
          // { required: true, message: '邮箱不能为空', trigger: 'blur' },
          { validator: checkoutEemail, trigger: 'change' }
        ],
        phone: [
          { required: true, message: '手机号不能为空', trigger: 'blur' },
          {
            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur'
          }
        ],
        indentifyCode: [
          { required: true, message: '身份证号不能为空', trigger: 'blur' },
          { validator: checkoutIdCord, trigger: 'change' }
        ],
        startTime: [
          { required: true, message: '开始时间不能为空', trigger: 'blur' },
        ],
        endTime: [
          { required: true, message: '开始时间不能为空', trigger: 'blur' },
        ],
      },

}
}