vue. elinput限制小数点输入
时间: 2023-07-07 19:37:56 浏览: 107
你可以通过设置 `input` 组件的 `keypress` 事件来限制小数点输入。以下是一个示例:
```html
<template>
<div>
<el-input v-model="value" @keypress="onKeyPress"></el-input>
</div>
</template>
<script>
export default {
data() {
return {
value: ''
};
},
methods: {
onKeyPress(event) {
const charCode = String.fromCharCode(event.keyCode);
// 只允许输入数字和小数点
if (!/^\d+$/.test(charCode) && charCode !== '.') {
event.preventDefault();
}
// 只允许输入一个小数点
if (charCode === '.' && this.value.indexOf('.') !== -1) {
event.preventDefault();
}
}
}
};
</script>
```
在这个示例中,我们使用 `keypress` 事件来捕获输入事件。我们检查输入的字符是否是数字或小数点。如果不是,我们调用 `event.preventDefault()` 来阻止字符输入。如果输入的字符是小数点,我们还检查当前值是否已经包含一个小数点。如果是,我们也会阻止字符输入。
阅读全文