vue input 设置只能输入数字或者小数

**

在 Vue 中可以通过自定义指令来实现输入框只能输入数字或者小数的功能。以下是一个示例：

**

<template>
  <input v-numberOnly v-model="inputValue" type="text" />
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    };
  },
  directives: {
    numberOnly: {
      bind(el) {
        el.handler = function (event) {
          const input = event.target;
          input.value = input.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
        };
        el.addEventListener('input', el.handler);
      },
      unbind(el) {
        el.removeEventListener('input', el.handler);
      }
    }
  }
};
</script>

• 在上述代码中，定义了一个名为numberOnly的自定义指令，在指令的bind方法中添加了一个输入事件监听器，对输入值进行正则替换，只保留数字和小数点，并且确保小数点只能有一个。在unbind方法中移除了监听器。