vue前端表单校验

data() {
  return {
    visible: false,
    dataForm: {
      brandId: 0,
      name: "",
      logo: "",
      descript: "",
      showStatus: 1,
      firstLetter: "",
      sort: 0
    },
    dataRule: {
      name: [{ required: true, message: "品牌名不能为空", trigger: "blur" }],
      logo: [
        { required: true, message: "品牌logo地址不能为空", trigger: "blur" }
      ],
      descript: [
        { required: true, message: "介绍不能为空", trigger: "blur" }
      ],
      showStatus: [
        {
          required: true,
          message: "显示状态[0-不显示；1-显示]不能为空",
          trigger: "blur"
        }
      ],
      firstLetter: [
        {
          validator: (rule, value, callback) => {
            if (value == "") {
              callback(new Error("首字母必须填写"));
            } else if (!/^[a-zA-Z]$/.test(value)) {
              callback(new Error("首字母必须a-z或者A-Z之间"));
            } else {
              callback();
            }
          },
          trigger: "blur"
        }
      ],
      sort: [
        {
          validator: (rule, value, callback) => {
            if (value == "") {
              callback(new Error("排序字段必须填写"));
            } else if (!Number.isInteger(value) || value<0) {
              callback(new Error("排序必须是一个大于等于0的整数"));
            } else {
              callback();
            }
          },
          trigger: "blur"
        }
      ]
    }
  };
},