vue2中让input只能输入数字
时间: 2023-07-04 07:04:24 浏览: 104
vue-input-only-number
可以通过Vue的指令来实现,具体步骤如下:
1.在input标签中添加v-on:input指令,绑定一个方法。
2.在该方法中,使用正则表达式判断输入的字符是否为数字,如果不是数字,则将其从input中删除。
下面是示例代码:
```
<template>
<div>
<input type="text" v-model="number" v-on:input="checkNumber">
</div>
</template>
<script>
export default {
data() {
return {
number: ''
}
},
methods: {
checkNumber() {
this.number = this.number.replace(/[^\d]/g, '')
}
}
}
</script>
```
上述代码中,我们在input标签中添加了v-on:input指令,并绑定了checkNumber方法。在checkNumber方法中,我们使用正则表达式/[^\d]/g来匹配非数字字符,然后使用replace方法将其替换为空字符串。这样,用户就无法输入非数字字符了。
阅读全文