vue+element项目中过滤输入框特殊字符小结
作者:Thinkguo 发布时间:2024-04-28 10:53:44
标签:vue,element,过滤,特殊,字符
可以在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
}
};
总结
以上所述是小编给大家介绍的vue+element项目中过滤输入框特殊字符小结,网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
来源:https://www.cnblogs.com/thinkguo/archive/2019/08/06/11310376.html


猜你喜欢
- 本文说明向外扩展数据库系统的两个选项,从而实现更高的可扩展性:水平数据划分和垂直数据划分当我提到向外扩展数据库系统时,我实际上只是讨论对数据
- 一、类型数组是值类型,将一个数组赋值给另一个数组时,传递的是一份拷贝。切片是引用类型,切片包装的数组称为该切片的底层数组。我们来看一段代码/
- B-树 1 .B-树定义B-树是一种平衡的多路查找树,它在文件系统中很有用。定义:一棵m 阶的B-树,或者为空树,或为满足下列特性的m 叉树
- 记得很早以前看到过这样的一段介绍:想象你在逛街边的一家书店,如果最终你没有购买任何图书就直接离开了,店长并不会知道你来过。但是如果你买了书,
- 注册模块default.asp 代码如下:<!DOCTYPE html PUBLIC "-//
- 1、安装Node.js,node.js安装包及源码下载地址为:https://nodejs.org/en/download/。2、安装npm
- Python中对象方法的定义很怪异,第一个参数一般都命名为self(相当于其它语言的this),用于传递对象本身,而在调用的时候则不必显式传
- 1. 函数式编程概述1.1. 什么是函数式编程?函数式编程使用一系列的函数解决问题。函数仅接受输入并产生输出,不包含任何能影响产生输出的内部
- 一、导包import pandas as pdimport matplotlib.pyplot as plt二、绘制简单折线数据:有一个Ex
- 熟悉SQL SERVER 2000的数据库管理员都知道,其DTS可以进行数据的导入导出,其实,我们也可以使用Transa
- 首先需求一共有五次猜测机会,在五次机会中才对就赢了,结束游戏,五次都猜错就输了,也结束游戏。首先先画个草图,这是我画的草图再根据草图编写一个
- 首先看一下来自Wolfram的定义 马尔可夫链是随机变量{X_t}的集合(t贯穿0,1,..
- 这篇文章与大家分享13个超级有用的 jQuery 内容滚动插件和教程。您可能经常能看到一些网站上特色区域的内容以滚动方式变化,这是一种在有限
- 牛顿摆是一个1960年代发明的桌面演示装置,五个质量相同的球体由吊绳固定,彼此紧密排列。又叫:牛顿摆球、动量守恒摆球、永动球、物理撞球、碰碰
- 思路有些混乱,希望大家能理解我的意思。看了faster rcnn的tensorflow代码,关于fix_variables的作用我不是很明白
- 微博模拟登录这是本次爬取的网址:https://weibo.com/一、请求分析找到登录的位置,填写用户名密码进行登录操作看看这次请求响应的
- 优先队列的二叉堆实现在前面的章节里我们学习了“先进先出”(FIFO)的数据结构:队列(Queue)。队列有一种变体叫做“优先队列”(Prio
- 一、简介Paramiko模块是基于Python实现的SSH远程安全连接,用于SSH远程执行命令、文件传输等功能。安装模块默认Python没有
- 在将数据库从MSSQL迁移到MySQL的过程中,基于业务逻辑的要求,需要在MySQL的自增列插入0值。在MSSQL中是这样完成的: stri
- 前几天,酋长同学在日志里提到了关于Google宽松的管理制度,一个产品任务下来是没有时间限制的,Google深信在有时间限制下的产品肯定是不