博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
扫码枪读取条形码数据(vue)
阅读量:4554 次
发布时间:2019-06-08

本文共 948 字,大约阅读时间需要 3 分钟。

扫码枪是模拟键盘输入的,所有事件为document.onkeypress = function(){}.

在vue项目中,是没有window.onload的,所以在created钩子函数中做:

var b = "";    var _this = this;    document.onkeydown = function() {      if (event.keyCode != 13) {        var bizCode = String.fromCharCode(event.keyCode);        if (event.keyCode >= 48 && event.keyCode <= 122) {          b = b + bizCode;        }      } else {        b = "";      }      _this.msg = b;    };

在document.onkeydown中获取了条码的值,此时的值是,6,65,657,6579,65794,657943,6579435...按照按键依次展示出来的。

如果需要条码值与页面中其他值一起做数据处理,则需要监听;

在watch中,需要了解一下immediate和handler.如果在最初绑定某值时就需要执行函数,就需要用到immediate属性。

1 watch:{ 2   msg:{ 3   handler(oldValue, newValue){ 4     //由于此时扫描出的值是一个字符一个字符累加的,所有用一个数组装起来。 5 var arry = [] 6 arry.push(this.msg) 7 for(var i = 0; i < arry.length; i++){ 8   //...做判断,调接口什么的,随业务逻辑写了   9 }10 }  11 },12 immediate: true      13 }

还有一点,就是多次扫码会产生叠加,在document.onkeydown的最下方将msg清空即可。

转载于:https://www.cnblogs.com/lesliejavascript/p/11459745.html

你可能感兴趣的文章
【灵异短篇】这个夜晚有点凉
查看>>
一点小问题
查看>>
pytest 10 skip跳过测试用例
查看>>
MVC身份验证及权限管理
查看>>
slider控件用法
查看>>
java中cookie的创建和销毁
查看>>
It was not possible to find any compatible framework version
查看>>
gulp与webpack的区别
查看>>
offset--BUG
查看>>
CSS选择器
查看>>
POJ_3667 线段树+lazy (线段树经典题)
查看>>
Android获取图片资源的4种方式
查看>>
找工作---操作系统常考知识点总结【PB】
查看>>
解决ionic <ion-nav> rootParams获取不到参数
查看>>
Python学习02 列表 List
查看>>
[DOM Event Learning] Section 3 jQuery事件处理基础 on(), off()和one()方法使用
查看>>
python爬虫-淘宝商品密码(图文教程附源码)
查看>>
centos6.3下如何搭建LAMP环境
查看>>
C#的一些基础内容
查看>>
nodejs概述
查看>>