input限制只能输入正整数

要限制 input 元素只能输入正整数，可以使用以下几种方法：

1. 使用 HTML5 的 type="number" 属性 

这种方式可以限制输入框只接受数字输入，并且可以通过 min 和 step 属性设置最小值和步长。

<input type="number" min="1" step="1">

2.使用正则表达式进行输入验证

使用 @input 事件监听输入框的输入事件，并在 validateInput 方法中使用正则表达式过滤掉非数字和非正整数的字符。

// html
<input type="text" @input="validateInput">

// js
methods: {
  validateInput(event) {
    let value = event.target.value;
    event.target.value = value.replace(/[^1-9]/g, '');
  }
}

3. 使用 keydown 事件监听并阻止非法字符的输入

监听 keydown 事件，并使用正则表达式检查按下的键是否为数字键。如果不是数字键，则调用 event.preventDefault() 方法阻止输入

// html
<input type="text" @keydown="validateKeydown">

// js
methods: {
  validateKeydown(event) {
    if (!/[0-9]/.test(event.key)) {
      event.preventDefault();
    }
  }
}

4. 使用 v-model.number 指令 (Vue.js)

使用 Vue.js 的 v-model.number 指令将输入框的值自动转换为数字类型。这样可以确保输入框只接受数字输入。

<input type="text" v-model.number="myNumber">

以上是几种常见的限制 input 元素只能输入正整数的方法。小伙伴们根据具体需求选择合适的方式使用哦~