el-input onkeyup 设置只能输入数字和小数点
时间: 2023-10-17 16:13:14 浏览: 185
可以使用正则表达式来限制 el-input 只能输入数字和小数点。可以使用 onkeyup 事件监听输入框的内容,然后通过正则表达式过滤不符合要求的字符。
下面是一个示例代码:
```html
<el-input v-model="value" @keyup="onKeyUp"></el-input>
```
```js
export default {
data() {
return {
value: ''
}
},
methods: {
onKeyUp() {
// 过滤非数字和小数点
this.value = this.value.replace(/[^\d.]/g, '')
// 限制只能输入一个小数点
let dotIndex = this.value.indexOf('.')
if (dotIndex !== -1 && this.value.lastIndexOf('.') !== dotIndex) {
this.value = this.value.substring(0, dotIndex + 1) + this.value.substring(dotIndex + 1).replace(/\./g, '')
}
}
}
}
```
在 onKeyUp 方法中,首先使用正则表达式 /[^\d.]/g 过滤掉所有非数字和小数点的字符。然后再判断是否存在小数点,如果存在,限制只能输入一个小数点。最后将过滤后的值赋值给输入框的 v-model。
阅读全文