vue中 <input type="number"> 遇到的问题

有一个input标签 需求是不想让用户输入e. 如果输入e, 将其删掉

调试过程中发现, 在输入e的时候, 通过回调事件拿到的值是空字符串. 无法探测到字符串'e' 如果此时再将绑定的变量赋值成'', 那么vue内部对比的时候发现'' === '', 将不会执行赋值操作 所以先赋值成' ', 再触发@change, 最终达到输入e变成空字符串的效果

代码如下

<template>
  <el-input
    type="number"
    placeholder="输入金额"
    v-model="form.price"
    @input="e => handleFloatInput(e, data, 'price')"
    @change="handleChange"
  ></el-input>
</template>

<script>
const someOp = (str) => {
  if (!str) return str;
  // 其他操作
};

export default {
  data() {
    return {
      form: { price: '' },
    };
  },
  methods: {
    handleFloatInput(v, obj, fieldName) {
      this.$set(obj, fieldName, someOp(v) || ' ');
    },
    // 这个方法包含把空格替换成空字符串的逻辑
    handleChange(v) {
      const newV = ...// 其他操作
      this.$set(obj, fieldName, newV || '');
    },
  },
}
</script>