element表单验证常用的几种规则

第一种必填校验

 { required: true, message: '请输入活动名称', trigger: 'blur' },

第二种字符数校验

{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }

第三种正则校验

{pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/, message: '请输入正确格式,可保留两位小数',trigger: 'change' }

第四种类型校验

 { type: 'number',min: 2, message: '请输入不少于2个字符', trigger: 'blur' },

自定义校验规则

{ 
              validator(_, value, callback){
                // rule：采用的规则
                // value: 被校验的值
                // callback是回调函数， 
                //      如果通过了规则检验，就直接调用callback()
                //      如果没有通过规则检验，就调用callback(错误对象，在错误对象中说明原因)
                //         例如：callback(new Error('错误说明'))
                if(value === '123456'){
                  callback(new Error('密码不能为123456'))
                } else{
                  callback()
                }
                // console.log(rule, value, callback)
              }, 
              trigger:"blur"
            }

手动兜底校验

 submitForm(formName) {
       this.$refs[formName].validate((valid) => {
         if (valid) {
           alert('submit!');
         } else {
           console.log('error submit!!');
           return false;
         }
       });
     },

清除内容及校验规则

 resetForm(formName) {
        this.$refs[formName].resetFields();
      }