vue扫码(二维码)

```
// scanMixin.js

export default {
  data() {
    return {
      code: '',
      lastTime: '',
      nextTime: '',
      lastCode: '',
      nextCode: '',
      dtmainId: '',
    };
  },
  activated() {
    window.addEventListener('keypress', this.scanEventHandler, false);
  },
  beforeDestroy() {
    window.removeEventListener('keypress', this.scanEventHandler, false);
  },
  deactivated() {
    window.removeEventListener('keypress', this.scanEventHandler, false);
  },
  methods: {
    scanEventHandler(e) {
      if (window.event) { // IE
        this.nextCode = e.keyCode;
      } else if (e.which) { // Netscape/Firefox/Opera
        this.nextCode = e.which;
      }
      if (e.which === 13) { // 键盘回车事件
        if (this.code.length < 3) return; // 扫码枪的速度很快，手动输入的时间不会让code的长度大于2，所以这里不会对扫码枪有效
        console.log('扫码结束。');
        console.log('条形码：', this.code);
        this.parseQRCode(this.code); // 获取到扫码枪输入的内容，做别的操作
        this.code = '';
        this.lastCode = '';
        this.lastTime = '';
        return;
      }
      this.nextTime = new Date().getTime();
      if (!this.lastTime && !this.lastCode) {
        this.code = ''; // 清空上次的条形码
        this.code += e.key;
        console.log('扫码开始---', this.code);
      }
      console.log('aaa: ', e);
      if (this.lastCode && this.lastTime && this.nextTime - this.lastTime > 500) { // 当扫码前有keypress事件时,防止首字缺失
        this.code = e.key;
        console.log('防止首字缺失。。。', this.code);
      } else if (this.lastCode && this.lastTime) {
        this.code += e.key;
        console.log('扫码中。。。', this.code);
      }
      this.lastCode = this.nextCode;
      this.lastTime = this.nextTime;
    },
    /**
     * 扫码结束, 处理自己的逻辑
     * @param code
     */
    parseQRCode(code) {
      console.log('code: ', code);
    },
  },
};
```

Leanote's Blog

Navigation

Recent Posts

Friend Links