表单校验el-input只能输入数字保留两位小数代码演示
时间: 2023-10-17 14:13:44 浏览: 91
可以使用正则表达式来对 el-input 进行数字校验,以下是一个简单的例子:
```html
<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 失去焦点时调用该方法进行校验,如果不符合格式,则提示用户输入正确的数字并清空输入内容。
阅读全文