VUE el-input正则验证

①只能输入大于0的整数

check(value) {
    let reg = /^[1-9]d*$/;
    var _this = this;
    if (value) {
        if (new RegExp(reg).test(value) == false) {
            setTimeout(() => {
                _this.actionDataForm.studNum = '';
               _this.errorTip = true;
        }, 500); }

       else { 
      this.errorTip = false; 
    } 
  } 
},
var checkBalance = (rule, value, callback) => {
    if (!value) {
        return callback(new Error('充值余额不能为空'));
    }
    setTimeout(() => {
        if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
        } else {
            if (Number(value) > 999999) {
                callback(new Error('请输入1-999999的数字'));
            } else {
                callback();
            }
        }
    }, 1000);
};
var checkBalance = (rule, value, callback) => {
    let reg = /^[1-9]d*$/;  //整数
    let reg2 = /^[1-9]d*.d*|0.d*[1-9]d*$/;  //小数
    if (!value) {
        return callback(new Error('充值余额不能为空'));
    }
    setTimeout(() => {
        if (!reg.test(value)) {
            if (reg2.test(value)) {
                callback(new Error('请输入整数'));
            } else {
                callback(new Error('请输入符合规则的数字'));
            }
        } else if (Number(value) > 999999) {
            callback(new Error('请输入1-999999的数字'));
        } else {
            callback();
        }
    }, 1000);
};

②只能输入数字(整数,浮点数)

check() {
    let reg = /[^d.]/g;
    if (this.searchKey && new RegExp(reg).test(this.searchKey)) {//非数字
        this.$message({
            message: '请输入正确的数字',
            type: 'warning'
        })
        return;
    }
    ...
    ...
},

③手机号验证

checkMobile (number) {
    var partten = /^(13[0-9]|14[0-9]|15[0-9]|16[6]|18[0-9]|19[6,9]|17[0-9])d{8}$/i;
    return partten.test(number);
},

④邮箱验证

var checkEmail = (rule, value, callback) => {
    if (!value) {
        return callback();
    }
    if (value) {
        setTimeout(() => {
            var reg = /^([a-zA-Z0-9]+[_|\_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|.]?)*[a-zA-Z0-9]+.[a-zA-Z]{2,3}$/;
            if (!reg.test(value)) {
                callback(new Error('请输入有效的电子邮箱!'));
            } else {
                callback();
            }
          }, 500);
      }
}

⑤将输入框的内容全角转为半角

var ToCDB = function(str){ 
    var tmp = ""; 
    for(var i=0;i<str.length;i++) 
    { 
        if(str.charCodeAt(i)>65248&&str.charCodeAt(i)<65375) 
        { 
            tmp += String.fromCharCode(str.charCodeAt(i)-65248); 
        }else { 
            tmp += String.fromCharCode(str.charCodeAt(i)); 
        } 
    } 
    return tmp 
}

⑥名称字数限制(30个中文字符长度)

nameLimt (){
    var reg = /[!@#$%^&*??/\“::;~+]/;
    this.companyName = this.companyName.replace(reg,'')    ;
    var GetLength = function (str) {
        //获得字符串实际长度,中文2,英文1
        var realLength = 0, len = str.length, charCode = -1;
        for (var i = 0; i < len; i++) {
            charCode = str.charCodeAt(i);
            if (charCode >= 0 && charCode <= 128) realLength += 1;
            else realLength += 2;
        }
      return realLength;
    };
    
     /** 
    * js截取字符串,中英文都能用 
    * @param str:需要截取的字符串 
    * @param len: 需要截取的长度 
    */
    var cutstr = function(str, len) {
        var str_length = 0;
        var str_len = 0;
        var str_cut = new String();
         str_len = str.length;
        for (var i = 0; i < str_len; i++) {
            var temp = str.charAt(i);
            str_length++;
            if (escape(temp).length > 4) {//中文字符的长度经编码之后大于4  
                str_length++;
            }
            str_cut = str_cut.concat(temp);
            if (str_length >= len) {
             return str_cut;
         }
       }
            
        //如果给定字符串小于指定长度,直接返回  
         if (str_length < len) {
           return str;
      }
    }
        
    if(GetLength(this.companyName) > 60){
        this.companyName = cutstr(this.companyName, 60);
        return;
    }
        
}

⑦只能输入正整数和负整数

let reg = /^(0|[1-9][0-9]*|-[1-9][0-9]*)$/;

⑧以字符开头只能输入数字、字母、下划线

let reg = /^[a-zA-Z][a-zA-Z0-9_]*$/
        var checkEmail = (rule, value, callback) => {
            if (!value) {
                return callback();
            }
            if (value) {
                setTimeout(() => {
                    var reg = /^([a-zA-Z0-9]+[_|\_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|.]?)*[a-zA-Z0-9]+.[a-zA-Z]{2,3}$/;
                    if (!reg.test(value)) {
                        callback(new Error('请输入有效的电子邮箱!'));
                    } else {
                        callback();
                    }
                }, 500);
            }
        };

rules: {
                name: [
                    {required: true, message: '请输入姓名', trigger: 'blur'},
                    {min: 1, max: 15, message: '长度在 15 个字以内', trigger: 'blur'}
                ],
                email: [
                    {validator: checkEmail, trigger: ['blur,change']}
                ],

            },
/**
 * @param {string} str
 * @returns {Boolean}
 */
export function validLowerCase(str) {
  const reg = /^[a-z]+$/
  return reg.test(str)
}

/**
 * @param {string} str
 * @returns {Boolean}
 */
export function validUpperCase(str) {
  const reg = /^[A-Z]+$/
  return reg.test(str)
}

/**
 * @param {string} str
 * @returns {Boolean}
 */
export function validAlphabets(str) {
  const reg = /^[A-Za-z]+$/
  return reg.test(str)
}

https://www.cnblogs.com/websmile/p/8650930.html   vue +element 搭建项目,el-input 常用的验证

https://www.cnblogs.com/lieone/p/11856330.html  前端Vue中常用rules校验规则
https://www.cnblogs.com/luoxuemei/p/9295506.html   vue如何使用rules对表单字段进行校验
https://www.jb51.net/article/174246.htm     Vue中常用rules校验规则(实例代码)

原文地址:https://www.cnblogs.com/shy1766IT/p/11161533.html