vue+element项目中过滤输入框特殊字符小结
程序员文章站
2022-06-23 23:14:10
可以在main.js中写入方法 HTML部分 需要将v-model拆分为:value和@input 通过以上方法又扩展出以下方法 ......
可以在main.js中写入方法
vue.prototype.validse = function (value, number = 255) { value = value.replace(/[`~*~!@#$%^&*()_\-+=<>?:"{}|,./;'\\[\]·~!@#¥%……&*()——\-+={}|《》?:“”【】、;‘’,。、]/g, '').replace(/\s/g, ""); if (value.length >= number) { this.$message({ type: "warning", message: `输入内容不能超过${number}个字符` }); } return value; };
html部分
<el-input maxlength='15' :value="searchform.logid" @input='e => searchform.logid = validse (e,15)' placeholder="请输入日志id"></el-input>
需要将v-model拆分为:value和@input
通过以上方法又扩展出以下方法
//只能输汉字 vue.prototype.chineseonly = function (value) { value = value.replace(/[^\u4e00-\u9fa5]/g, ''); return value }; //只能输正整数 vue.prototype.idonly = function (value) { value = value.replace(/[^0-9]/g, ''); return value }; //不允许输汉字 vue.prototype.nochineseonly = function (value) { value = value.replace(/[\u4e00-\u9fa5]/g, ''); return value };
//逗号和数字 vue.prototype.programidonly = function (value) { value = value.replace(/[^0-9,]/g, ''); return value }; //数字和回车 vue.prototype.idsonly = function (value) { value = value.replace(/[^\r\n0-9]/g, ''); return value }; //数值大小限定 vue.prototype.numberlimit = function (value) { value = value.replace(/[^0-9]/g, ''); if (value >= 2147483647) { this.$message({ type: "warning", message: `最大可输入值为2147483647` }); } return value };
// 正整数 vue.prototype.onlypositiveinteger = function (value) { value = string(value).match(/[1-9]\d*/g, "") return value === null ? '' : number(value[0]) }; // 正整数(包含0) vue.prototype.onlypositiveinteger1 = function (value) { console.log(typeof (value)); value = string(value).match(/[1-9]\d*|0/g, "") return value === null ? '' : number(value[0]) }; // 负整数 vue.prototype.onlynegativeinteger = function (value) { value = string(value).match(/^-[1-9]*\d*/g, "") return value === null ? '' : value[0] === '-' ? '-' : value[0] === '-0' ? '' : number(value[0]) }; // 负整数(包含0) vue.prototype.onlynegativeinteger1 = function (value) { value = string(value).match(/^-[1-9]*\d*|0/g, "") return value === null ? '' : value[0] === '-' ? '-' : number(value[0]) }; // 整数 vue.prototype.onlyinteger = function (value) { value = string(value).match(/^-?[1-9]*\d*|0/g, '') return value === null ? '' : value[0] === '-' ? '-' : value[0] === '' ? '' : number(value[0]) }; // 整数区间 vue.prototype.onlysection = function (value, min, max) { if (min < 0) { value = string(value).match(/-?[1-9]*\d*/g, "") } else { value = string(value).match(/[1-9]*\d*/g, "") } // value = string(value).match(/-?[1-9]*\d*/g, "") value = value === null ? '' : value[0] === '-' ? '-' : value[0] === '' ? '' : number(value[0]) if (value < min) { return min } else if (value > max) { return max } else { return value } };