Vue3 输入框限制只能输入数字 - 代码示例与解释

<template>
  <input v-model="inputValue" @input="handleInput" type="text">
</template>
<script>
export default {
  data() {
    return {
      inputValue: ''
    }
  },
  methods: {
    handleInput(event) {
      // 使用正则表达式替换非数字字符为空字符串
      this.inputValue = event.target.value.replace(/\D/g, '');
    }
  }
}
</script>
<p>在上面的代码中，使用<code>v-model</code>指令将输入框的值绑定到<code>inputValue</code>属性上。然后，在输入事件<code>@input</code>中，使用正则表达式<code>\/D\/g</code>替换非数字字符为空字符串，从而限制输入框只能输入数字。</p>
<p>请注意，这只是一个简单的示例，如果需要更复杂的输入限制，可以使用更复杂的正则表达式或其他验证方法。</p>