Vue项目判断Enter回车事件是直接按键盘触发还是扫码枪触发

Vue项目判断Enter回车事件是直接按键盘触发还是扫码枪触发

原因叙述：我们知道键盘事件包括keyDown、keyPress和keyUp三个；然后扫码触发的Enter事件是很快的，一般在10毫秒左右，而直接按键盘触发的Enter相对来说比较慢80毫秒左右。在keyDown【按下】的时候，我们记录一个keyDownTime时间，在keyUp【弹起】的时候，我们又记录一个keyUpTime时间，之后两个相减小于30毫秒【keyUpTime-keyDownTime<30】，我们可以判断是扫码触发的还是直接按键触发的。

代码如下：

1）template部分：

<el-input
   v-model="courierNumber"
   clearable
   @keydown.enter.native="courierNumberEnterDown()"
   @keyup.enter.native="courierNumberEnterUp()"
   ref="courierNumber"
 ></el-input>

2）script部分：

// keyDownTime和keyUpTime在data定义
courierNumberEnterDown(e) {
   this.keyDownTime = new Date().getTime();
 },
 courierNumberEnterUp(e) {
   this.keyUpTime = new Date().getTime();
   if (this.keyUpTime - this.keyDownTime < 30) {
     //扫码枪触发
     console.log("扫码Enter");
   } else {
   	//直接按键盘触发
     console.log("直接Enter");
   }
 },

有不足一起讨论…