vue 表单自定义校验

<el-form :model="dataForm" label-width="100px" :rules="dataFormRules" ref="dataForm" ></el-form>

import { isPhone } from "@/utils/validate"
data() {
      return {
        dataFormRules: {
          username: [
            { required: true, message: '请输入用户名', trigger: 'blur' },
            { type: 'string', min: 6, message: '用户名不允许小于6位', trigger: 'blur' },
          ],
          mobile: [
            { required: true, message: '手机号不能为空', trigger: 'blur' },
            { type: 'string', min: 11, message: '手机号不允许小于11位', trigger: 'blur' },
            { validator: isPhone, trigger: 'blur' },
          ]
        },
  }
}

/**
 * 验证手机号
 */
export function isPhone(rule, value, callback) {
  if (!value) {
    return callback(new Error('输入不可以为空'));
  }
  var pattern = /^1[3-9]\d{9}$/
  if (pattern.test(value)) {
    return callback()
  }
  return callback(new Error('输入的手机号错误'))
}