el-input输入框限制及常用的校验规则

业务背景:el-input数字类型的各种校验

话不多说,上码,复制粘贴直接看效果

1. 输入数字后获取值为String 类型(.number )
<el-input  
	type="number"
	v-model.number="xxx"
>
</el-input>
2. 只能输入正整数,不能以0开头,以负号(-)开头
<el-input 
	oninput="value=value.replace(/^(0+)|[^\d]+/g,''); " 
	type="number">
</el-input>
3. 输入小于xx的数,自动变成xx,例如:0
<el-input 
	oninput="if(value < 0 || value == null) value = 0;"
	type="number">
</el-input>
4. 输入大于xx的数,自动变成xx,例如:99
<el-input 
	oninput="if(value > 99) value = 99; " 
	type="number">
</el-input>
5. 禁止输入空格==>(.trim)
<el-input  
	type="number"
	v-model.trim="xxx"
>
</el-input>
6. rules常用校验
名称Value
手机号或者固话/^((0\d{2,3}-\d{7,8})|(1[34578]\d{9}))$
邮箱/^([a-zA-Z0-9]+[-_.]?)+@[a-zA-Z0-9]+.[a-z]+$/
合法IP/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]).(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]).(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]).(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
小写字母/^[a-z]+$/
大写字母/^[A-Z]+$/
大小写/^[A-Za-z]+$/
数字英文,不包含特殊字符/^[a-zA-Z0-9]+$/
中文校验/^[\u0391-\uFFE5A-Za-z]+$/
两位小数/(^[1-9]([0-9]+)?(.[0-9]{1,2})?$)|((0){1}$)|([0-9].0-9?$)/

如果对你有帮助,赏个三连呗🙇‍🙇‍,不胜感激Thanks♪(・ω・)ノ

  • 6
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值