el-input 只能输入数字或两位小数

以下是两种 el-input 只能输入数字或两位小数的例子：
1. 只能输入纯数字

<el-input v-model="aaa" type="text" @input="(v) => (aaa=v.replace(/[^\d]/g,'))"></el-input>

2. 能输入纯数字和小数（比如：6.66）

<el-input v-model="aaa" type="text" @input="(v) => (aaa=v.replace(/[^\d.]/g,'').replace(/^\./g,'').replace(/\.{2,}/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'))"></el-input>

其中，第二种方法可以输入小数点，但是只能输入两位小数，且小数点不能在开头或结尾。

相关问题

正则匹配el-input只能输入数字 保留两位小数

正则表达式是一种文本模式，包括普通字符（例如，a 到 z 之间的字母）和特殊字符（称为"元字符"）。正则表达式通常用于检索、替换那些符合某个模式（规则）的文本。在Vue.js的`el-input`组件中，可以通过设置`v-model`进行双向数据绑定，并结合`键盘事件`（如`keypress`）或者`输入事件`（如`input`）以及正则表达式来限制用户输入的格式，使得`el-input`只能输入数字并且保留两位小数。

以下是一个示例代码，展示了如何使用正则表达式来限制`el-input`只能输入数字并且保留两位小数：

<template>
  <el-input v-model="inputValue" @input="handleInput"></el-input>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    }
  },
  methods: {
    handleInput(value) {
      // 正则表达式匹配数字且保留两位小数
      const reg = /^\d*(\.\d{0,2})?$/;
      // 如果输入不匹配，则清空输入框
      if (!reg.test(value)) {
        this.inputValue = this.inputValue.slice(0, -1); // 移除最后一个非法输入的字符
      }
    }
  }
}
</script>

在这个例子中，`handleInput`方法会在每次用户输入时被调用。通过正则表达式`/^\d*(\.\d{0,2})?$/`，我们允许输入的值从0个或多个数字开始，然后是可选的点（`.`），后面跟着最多2个小数位。如果不满足这个条件，就会清除掉不符合规则的最后一个字符。

表单校验el-input只能输入数字保留两位小数代码演示

可以使用正则表达式来对 el-input 进行数字校验，以下是一个简单的例子：

<template>
  <el-input v-model="amount" placeholder="请输入金额" @blur="checkNumber"></el-input>
</template>

<script>
export default {
  data() {
    return {
      amount: ""
    }
  },
  methods: {
    checkNumber() {
      const reg = /^\d+(\.\d{1,2})?$/
      if (!reg.test(this.amount)) {
        this.$message.error("请输入正确的数字，最多保留两位小数")
        this.amount = ""
      }
    }
  }
}
</script>

这里使用 `reg` 变量来存放正则表达式，`^\d+(\.\d{1,2})?$` 表示至少一位数字，可以带小数点，小数点后最多两位小数。在 `checkNumber()` 方法中，每次 el-input 失去焦点时调用该方法进行校验，如果不符合格式，则提示用户输入正确的数字并清空输入内容。