由于项目中使用的单纯的input校验,所以选择使用按钮事件
:onkeypress(),
使用键盘弹起事件也是可以的
<template slot-scope="scope">
<div>
<el-input v-model="scope.row[scope.column.property]"
:show-overflow-tooltip="true"
:onkeyup="verify(scope)"/>
</div>
</template>
使用elementUI写的
verify(scope){
for (const value in scope.row) {
if( //限制整数和两位小数 9-2
value=="userNumber" //需要校验的具体字段
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputnum92(scope.row[value])
}
}
if( //限制整数和两位小数 12-2
value=="tradeSucEng"
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputnum12Do2(scope.row[value])
}
}
if( //限制整数和两位小数 6-2 正负
value=="approvedTariff"
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputnumZF62(scope.row[value])
}
}
if( //限制整数和两位小数 6-2 正数和负数
value=="purchaseEngMRate"
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputnumZF62(scope.row[value])
}
}
if( //限制正整数
value=="tradeSucNumber"
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputnumZZ(scope.row[value])
}
}
if( //校验大小字母 数字
value=="tradeNumber"
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputStringNum(scope.row[value])
}
}
if( //校验大小字母 中文 数字
value=="tradeName"
){
if(scope.row[value]!=""&&scope.row[value]!=null){
scope.row[value] = this.inputStringNumCn(scope.row[value])
}
}
}
},
//校验整数
inputnumZ(val){
val = val.toString()
let num = val.replace(/[^\d]/g, "")
.replace(/\-{2,}/g, '-'); //清除"数字"和"."以及"-"以外的字符;
return num
},
//校验正整数
inputnumZZ(val){
val = val.toString()
let num = val.replace(/[^\d]/g, "")
if (num.length > 9) {
num = num.slice(0, 9);
}//清除"数字"和"."以及"-"以外的字符;
return num
},
//校验小数 小数点前6位 小数点后2位 正负数
inputnumZF62(val) {
val = val.toString()
// let num = val.replace(/[^(\-|\+)?\d.]/g, ""); //清除"数字"和"."以外的字符
let num = val.replace(/[^(\-)?\d.]/g, "")
.replace(/\-{2,}/g, '-')
.replace(/^\./g, '')
.replace(/(\d.*)-/, '$1')
.replace(/(\..*)\-/, '$1')
.replace(/\-\./, ''); //清除"数字"和"."以及"-"以外的字符
num = num.replace(/^(\.)/g, ""); //验证第一个字符是数字
if (num.indexOf('.') == -1) { //小数点前留6位
if (num.length > 6) {
num = num.slice(0, 6);
}
} else {
if (num.split('.')[0].length > 6) {
num = num.split('.')[0].slice(0, 6) + '.' + num.split('.')[1];
}
}
num = num.replace(/\.{2,}/g, ""); //只保留第一个, 清除多余的
num = num.replace(".", "$#$")
.replace(/\./g, "")
.replace("$#$", ".");
// num = num.replace(/^(\-|\+)?(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
num = num.replace(/^\d\.(\d\d).*$/, '$1$2.$3')
.replace(/^\d\.(\d\d).*$/, '$1$2.$3')
.replace( /([0-9]+\.[0-9]{2})[0-9]*/,'$1') //只能输入两个小数
return num
},
//校验小数 小数点前9位 小数点后2位
inputnum92(val) {
val = val.toString()
let num = val.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
num = num.replace(/^\./g, ""); //验证第一个字符是数字
if (num.indexOf('.') == -1) { //小数点前留9位
if (num.length > 9) {
num = num.slice(0, 9);
}
} else {
if (num.split('.')[0].length > 9) {
num = num.split('.')[0].slice(0, 9) + '.' + num.split('.')[1];
}
}
num = num.replace(/\.{2,}/g, ""); //只保留第一个, 清除多余的
num = num.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
num = num.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
return num
},
//校验小数 小数点前12位 小数点后2位
inputnum12Do2(val) {
val = val.toString()
let num = val.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
num = num.replace(/^\./g, ""); //验证第一个字符是数字
if (num.indexOf('.') == -1) { //小数点前留12位
if (num.length > 12) {
num = num.slice(0, 12);
}
} else {
if (num.split('.')[0].length > 12) {
num = num.split('.')[0].slice(0, 12) + '.' + num.split('.')[1];
}
}
num = num.replace(/\.{2,}/g, ""); //只保留第一个, 清除多余的
num = num.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
num = num.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
return num
},
//校验大小字母 数字
inputStringNum(val) {
val = val.toString()
let num = val.replace(/[^\a-\z\A-\Z0-9]/g, "");
return num
},
//校验大小字母 中文 数字
inputStringNumCn(val) {
val = val.toString()
let num = val.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g, "");
return num
},
使用正则表达式实现输入非法字符的替换、由于正则的使用方式以及校验规则的千变万化这里不一一列举。
生存还是毁灭,这是个问题。是默然忍受命运的暴虐的毒箭,或是挺身反抗人世的无涯的苦难,通过斗争把它们扫清,这两种行为,哪一种更高贵? ——《哈姆雷特》