Element UI 自定义正则表达式验证

来源:互联网 发布:淘宝刷单好评 编辑:程序博客网 时间:2024/05/01 23:35
//指定数据中心的验证表单valiForm,验证规则rules<el-form :model="valiForm" :rules="rules" ref="valiForm" label-width="100px" class="demo-valiForm">        <el-form-item label="名称:" :label-width="formLabelWidth" prop='name'>          <el-input v-model="valiForm.name"></el-input>        </el-form-item></el-form>
//add('valiForm')方法要传验证表单名<el-button type="primary" @click="add('valiForm')">确 定</el-button>
 data () {    let nameRule1 = (rule, value, callback) => {      let regExp = //;      if (regExp.test(value) === false) {           callback(new Error('不通过正则'));        } else {          callback();      }    };    return {      valiForm: {          name: ''      },      rules: {          name: [            { required: true, message: '请输入名称', trigger: 'blur' },            { min: 5, max: 10, message: '长度在 5 到 10 个字符', trigger: 'blur' },            { validator: nameRule1, trigger: 'blur' }          ]      }    };  },
methods:{ add(formName) {      this.$refs[formName].validate((valid) => {        if (valid) {         //通过验证执行        } else {         //验证失败执行          console.log('error submit!!');          return false;        }      });    }}