当前位置:网站首页>el-input 只能输入整数(包括正数、负数、0)或者只能输入整数(包括正数、负数、0)和小数
el-input 只能输入整数(包括正数、负数、0)或者只能输入整数(包括正数、负数、0)和小数
2022-07-30 19:30:00 【bsegebr】
el-input标签即使使用type=number或者v-model.number属性,可能也没有完全符合我们想要的结果,所以下面手动写正则表达式
<el-input v-model="height" placeholder="请输入" @input="handleEdit" />
el-input 只能输入正整数(包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^d]/g, ""); // 只能输入数字
value = value.replace(/^0+(d)/, "$1"); // 第一位0开头,0后面为数字,则过滤掉,取后面的数字
value = value.replace(/(d{15})d*/, '$1') // 最多保留15位整数
this.height = value
}
el-input 只能输入正整数(不包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/^(0+)|[^d]+/g,''); // 以0开头或者输入非数字,会被替换成空
value = value.replace(/(d{15})d*/, '$1') // 最多保留15位整数
this.height = value
}
el-input 只能输入负整数(包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^-d]/g, ""); // 只能输入-和数字
value = value.replace(/^[1-9]/g, ""); // 不能以1-9开头
value = value.replace(/-{2,}/g, "-"); // -只能保留一个
value = value.replace(/(d)-/g, "$1"); // 数字后面不能接-,不能出现类似-11-2,12-,11-23
value = value.replace(/-(0+)/g, "0"); // 不能出现-0,-001,-0001类似
value = value.replace(/^0+(d)/, "0"); // 第一位0开头,0后面为数字,则过滤掉,取0
value = value.replace(/(-d{15})d*/, '$1') // 最多保留15位整数
this.height = value
}
el-input 只能输入负整数(不包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^-d]/g, ""); // 只能输入-和数字
value = value.replace(/^d/g, ""); // 不能以数字开头
value = value.replace(/-{2,}/g, "-"); // -只能保留一个
value = value.replace(/(d)-/g, "$1"); // 数字后面不能接-,不能出现类似-11-2,12-,11-23
value = value.replace(/(-)0+/g, "$1"); // 不能出现-0,-001,-0001类似
value = value.replace(/(-d{15})d*/, '$1') // 最多保留15位整数
this.height = value
}
el-input 只能输入整数(包括正整数、负整数、0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^-d]/g, ""); // 只能输入-和数字
value = value.replace(/-{2,}/g, "-"); // -只能保留一个
value = value.replace(/(d)-/g, "$1"); // 数字后面不能接-,不能出现类似-11-2,12-,11-23
value = value.replace(/-(0+)/g, "0"); // 不能出现-0,-001,-0001类似
value = value.replace(/^0+(d)/, "$1"); // 第一位0开头,0后面为数字,则过滤掉,取后面的数字
value = value.replace(/(-?d{15})d*/, '$1') // 最多保留15位整数
this.height = value
}
el-input 只能输入正小数(包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^d.]/g, '') // 只能输入数字和.
value = value.replace(/^./g, '') //第一个字符不能是.
value = value.replace(/.{2,}/g, '.') // 不能连续输入.
value = value.replace(/(.d+)./g, '$1') // .后面不能再输入.
value = value.replace(/^0+(d)/, '$1') // 第一位0开头,0后面为数字,则过滤掉,取后面的数字
value = value.replace(/(d{15})d*/, '$1') // 最多保留15位整数
value = value.replace(/(.d{2})d*/, '$1')// 最多保留2位小数
this.height = value
}
el-input 只能输入负小数(包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^-d.]/g, ""); // 只能输入-和数字和.
value = value.replace(/^[^-0]/g, ""); // 只能-和0开头
value = value.replace(/-{2,}/g, "-"); // 不能连续输入-
value = value.replace(/(-)./g, "$1"); // -后面不能输入.
value = value.replace(/.{2,}/g, "."); // 不能连续输入.
value = value.replace(/(.d+)./g, "$1"); // .后面不能再输入.
value = value.replace(/(d+|.)-/g, "$1"); // 数字和.后面不能接-,不能出现类似11-, 12.-
value = value.replace(/(-)0+(d+)/g, '$1$2') // 不能出现-01,-02类似
value = value.replace(/^0+(d|.)/, "0"); // 第一位0开头,0后面为数字或者.,则过滤掉,取0
value = value.replace(/(d{15})d*/, '$1') // 最多保留15位整数
value = value.replace(/(.d{2})d*/, '$1')// 最多保留2位小数
this.height = value
}
el-input 只能输入负小数(不包括0)
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^-d.]/g, ""); // 只能输入-和数字和.
value = value.replace(/^[^-]/g, ""); // 只能-开头
value = value.replace(/-{2,}/g, "-"); // 不能连续输入-
value = value.replace(/(-)./g, "$1"); // -后面不能输入.
value = value.replace(/.{2,}/g, "."); // 不能连续输入.
value = value.replace(/(.d+)./g, "$1"); // .后面不能再输入.
value = value.replace(/(d+|.)-/g, "$1"); // 数字和.后面不能接-,不能出现类似11-, 12.-
value = value.replace(/(-)0+(d+)/g, '$1$2') // 不能出现-01,-02类似
value = value.replace(/(d{15})d*/, '$1') // 最多保留15位整数
value = value.replace(/(.d{2})d*/, '$1')// 最多保留2位小数
this.height = value
}
el-input 输入整数(包括正数、负数、0)和小数,保留15位整数和2位小数
// 在 Input 值改变时触发
handleEdit(e) {
let value = e.replace(/[^-d.]/g, '') // 只能输入.和-和数字
value = value.replace(/^./g, '') //第一个字符不能是.
value = value.replace(/.{2,}/g, '.') // 不能连续输入.
value = value.replace(/(.d+)./g, '$1') // .后面不能再输入.
value = value.replace(/(-)./g, '$1') // -后面不能输入.
value = value.replace(/-{2,}/g, '-') // -只能保留一个
value = value.replace(/(d+|.)-/g, '$1') // 数字和.后面不能接-,不能出现类似11-, 12.-
value = value.replace(/-(0){2,}/g, "$1") // 不能出现-00,-001,-0001类似
value = value.replace(/(-)0+(d+)/g, '$1$2') // 不能出现-01,-02类似
value = value.replace(/^0+(d)/, '$1') // 第一位0开头,0后面为数字,则过滤掉,取后面的数字
value = value.replace(/(d{15})d*/, '$1') // 最多保留15位整数
value = value.replace(/(.d{2})d*/, '$1')// 最多保留2位小数
this.height= value
}
$1表示匹配第一个括号里的内容,$2表示匹配第二个括号的内容,比如
value = value.replace(/(-)./g, '$1') // 输入框输入-.就会替换成-
value = value.replace(/(-)(0{2,})/g, '$1$2') // 输入-00,-000,就会替换成-0
写得有点复杂,没办法,刚上手的正则表达式。如果配合el-input标签的type=number或者v-model.number属性,正则表达式部分也许不用写这么多而且复杂。有更简洁的方法请评论区留言
附上:
正则表达式 学习网址1
正则表达式 学习网址2
正则表达式在线测试网址
先自我介绍一下,小编13年上师交大毕业,曾经在小公司待过,去过华为OPPO等大厂,18年进入阿里,直到现在。深知大多数初中级java工程师,想要升技能,往往是需要自己摸索成长或是报班学习,但对于培训机构动则近万元的学费,着实压力不小。自己不成体系的自学效率很低又漫长,而且容易碰到天花板技术停止不前。因此我收集了一份《java开发全套学习资料》送给大家,初衷也很简单,就是希望帮助到想自学又不知道该从何学起的朋友,同时减轻大家的负担。添加下方名片,即可获取全套学习资料哦
边栏推荐
- Day31 LeetCode
- MindSpore:Cifar10Dataset‘s num_workers=8, this value is not within the required range of [1, cpu_thr
- 浅聊对比学习(Contrastive Learning)第一弹
- Difference between Object and Map
- Win11如何更改默认下载路径?Win11更改默认下载路径的方法
- 2种手绘风格效果比较,你更喜欢哪一种呢?
- Listen to the boot broadcast
- VBA runtime error '-2147217900 (80040e14): Automation error
- MySQL数据库之JDBC编程
- 电脑死机的时候,发生了什么?
猜你喜欢

VBA批量将Excel数据导入Access数据库

How to install and use PostgreSQL 14.4

centos7安装mysql8
![[TypeScript]编译配置](/img/ac/64ebd33de977e35620dbc18d2adfad.png)
[TypeScript]编译配置

NXP IMX8QXP replacement DDR model operation process

Zabbix 5.0 Monitoring Tutorial (1)

The 17th "Revitalization Cup" National Youth Vocational Skills Competition - Computer Programmers (Cloud Computing Platform and Operation and Maintenance) Participation Review and Summary

MindSpore:对image作normalize的目的是什么?

谷歌AlphaFold近日宣称预测出地球上几乎所有蛋白质结构
![[hbuilder] cannot run some projects, open the terminal and cannot enter commands](/img/fa/63f36683d090558f3fe5f582d86ca0.png)
[hbuilder] cannot run some projects, open the terminal and cannot enter commands
随机推荐
MindSpore:【MindSpore1.1】Mindspore安装后验证出现cudaSetDevice failed错误
NXP IMX8QXP更换DDR型号操作流程
The use of @ symbol in MySql
电脑死机的时候,发生了什么?
Talking about Contrastive Learning (Contrastive Learning) the first bullet
Zabbix 5.0 Monitoring Tutorial (1)
已删除
MongoDB打破了原则引入SQL?
VS Code connects to SQL Server
MindSpore:【resnet_thor模型】尝试运行resnet_thor时报Could not convert to
MySQl数据库————DQL数据查询语言
centos7安装mysql8
055 c# print
云数据库和本地数据库有什么区别?
Download Win11 how to change the default path?Download Win11 change the default path method
LeetCode每日一题(1717. Maximum Score From Removing Substrings)
牛客网——华为题库(100~108)
第十七届“振兴杯”全国青年 职业技能大赛——计算机程序设计员(云计算平台与运维)参赛回顾与总结
MindSpore:对image作normalize的目的是什么?
Scala学习:breakable