vue中input框只能输入数字

问题描述：在vue的input框只能输入数字，如电话号码等

实现代码：

<label>电话号码：</label>
  <input type="number" v-model="tel" placeholder="请输入" 
  oninput="if(value.length>11)value=value.slice(0,11)" @keydown="checkInput($event)">

其中：
1、type="number"限定只能输入数字，但可以是小数、自然对数的底：e，负数等
2、οninput=“if(value.length>11)value=value.slice(0,11)” 限定输入长度不得大于11位
3、@keydown则是添加一个vue键盘输入事件，触发方法checkInput

 checkInput(e){
      let prohibitInput= ["-", "e", "+", "E","."];
      if(prohibitInput.includes(e.key)){  
        e.preventDefault()
      }
    }

此方法作用为，当键盘输入与prohibitInput中值匹配到时，阻止元素发生的默认行为，实现prohibitInput中的值不能被输入。
但存在一个问题：当用中文输入法输入e并按回车，此时的输入的e则会在input框中展示，但输入框绑定的值其实是空的，所以需要增加一步校验就可以了，但是，出现这个问题我也没搞懂，希望有大佬能给解答一波~

增加输入校验

checkTelHead(tel){
	  //const r = /^\+?[0-9][0-9]*$/; // 正整数（可以以0打头）
      const r = /^\+?[1-9][0-9]*$/; // 正整数
      if (!r.test(tel)) {
        this.$alert("请输入正确的号码！");
        return false;
      };
      if(telHead.length != 11){
        this.$alert("请填写11位的号码！");
        return false;
      };
      return true;
    }