el-input 只能输入整数（包括正数、负数、0）或者只能输入整数（包括正数、负数、0）和小数

el-input标签即使使用type=number或者v-model.number属性，可能也没有完全符合我们想要的结果，所以下面手动写正则表达式

1

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
}
1
2
3
4
5
6
7

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
}
1
2
3
4
5
6

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
}
1
2
3
4
5
6
7
8
9
10
11

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
}
1
2
3
4
5
6
7
8
9
10

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
}
1
2
3
4
5
6
7
8
9
10

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
}
1
2
3
4
5
6
7
8
9
10
11

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
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

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
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14

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
3
4
5
6
7
8
9
10
11
12
13
14
15
16

$1表示匹配第一个括号里的内容，$2表示匹配第二个括号的内容，比如

value = value.replace(/(-)./g, '$1') // 输入框输入-.就会替换成-
value = value.replace(/(-)(0{2,})/g, '$1$2') // 输入-00,-000,就会替换成-0
1
2

写得有点复杂，没办法，刚上手的正则表达式。如果配合el-input标签的type=number或者v-model.number属性，正则表达式部分也许不用写这么多而且复杂。有更简洁的方法请评论区留言
附上：
正则表达式 学习网址1
正则表达式 学习网址2
正则表达式在线测试网址

先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。自己不成体系的自学效率很低又漫长，而且容易碰到天花板技术停止不前。因此我收集了一份《java开发全套学习资料》送给大家，初衷也很简单，就是希望帮助到想自学又不知道该从何学起的朋友，同时减轻大家的负担。添加下方名片，即可获取全套学习资料哦