element-ui 利用正则自定义验证表单 手机号/身份证/护

2021-07-20  本文已影响0人  Peter_2B
data() {
    return{
        linkmanRuleForm:{
          linkman: '',           //联系人姓名
          linkmanPhone: '',      //联系人电话
          certificateType: '',   //选择证件类型
          certificateNo: '',     //联系人身份证
          email: '',             //联系人邮箱
          loanLimit:'', // 贷款额度
        },
        rules: {
          linkman: [ 
            { required: true, message: '请输入姓名', trigger: 'blur' } 
          ],
          linkmanPhone: [
            { required: true, trigger: 'blur', validator: checkPhone }
          ],
          certificateType: [
            { required: true, message: '请选择证件类型', trigger: 'change' }
          ],
          certificateNo: [
            { required: true, trigger: 'blur', validator: cardIdNo }
          ],
          email: [
            { required: false, trigger: 'blur', validator: emailRule }
          ],
          loanLimit:[
            { required: true, message: '贷款额度不能为空', trigger: 'blur' },
            { validator: verifyInt, trigger: 'blur'}
          ],
        }
    },
    let checkPhone = (rule, value, callback) => {                     //注意: 自定义验证函数是放在data里的
      if (!value) {
        return callback(new Error('手机号不能为空'));
      } else {
        let reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
        if (!reg.test(value)) {
          callback(new Error('请输入正确的手机号'));
        } else {
          callback();
        }
      }
    };
    --------
    let cardIdNo = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('身份证号不能为空'));
      } else {
        let reg = /((^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$))/;
        if (!reg.test(value)) {
          callback(new Error('请输入正确的身份证号'));
        } else {
          callback();
        }
      }
    };
    ---------
    let passport = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('护照号不能为空'));
      } else {
        let reg =
          /(^1[45][0-9]{7}|([P|p|S|s]\d{7})|([S|s|G|g]\d{8})|([Gg|Tt|Ss|Ll|Qq|Dd|Aa|Ff]\d{8})|([H|h|M|m]\d{8,10})$)/;
        if (!reg.test(value)) {
          callback(new Error('请输入正确的护照号'));
        } else {
          callback();
        }
      }
    };
    ---------
    let emailRule = (rule, value, callback) => {
      if (!!value) {
        let reg =
          /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
        if (!reg.test(value)) {
          callback(new Error('请输入正确得邮箱号'));
        } else {
          callback();
        }
      } else {
        callback();
      }
    };
    -------------------------
    let verifyInt = (rule, value, callback)=>{
       if(Number.isInteger(Number(value)) && Number(value) > 0){                
        callback();
      }else{                 
        callback(new Error("请输入正整数"));               
      }   
    };
    -----------------------
    var verifyPrice = (rule, value, callback) => {
      const reg = /^\d+.?\d{0,2}$/
      if (!value) {
        callback(new Error('请输入贷款利息'));
      } else if (!Number(value)) {
        callback(new Error('请输入数字值'));
      } else {
        if (reg.test(value)) {
          callback()
        } else {
          callback(new Error('最多保留两位小数'));
        }
      }
    };

}
上一篇 下一篇

猜你喜欢

热点阅读