当前位置: 首页 > Web前端 > HTML5

vue+h5+hbuilder实现扫码功能

时间:2023-04-04 22:59:31 HTML5

先上传效果图,满足需求再深入阅读。最近在手机上写了一个扫码输入系统。这里简单介绍一下调??用原生APP扫描功能需要注意的几点。第一次接触H5扫描,在GitHub上翻了很多案例。一个共同的特点是在真机调试Hbuilder时,需要点击调用原生二维码扫描,我的需求是直接触发生成二维码。条码扫描控件,都是用新的plus.barcode.Barcode方法创建的,但是不显示。最后在文档中找到了解决办法。官方文档中给出了答案。我不想你翻文档时可以参考我图片上的写法``startRecognize(){letthat=thisif(!window.plus)return//scan=newplus.barcode.create('bcid');扫描=plus.barcode。create('bcid',[plus.barcode.QR],{top:'60px',left:'0px',width:'100%',height:'100%',position:'static'});加上.webview.currentWebview().append(scan);console.log("创建扫描控件--------",scan);//开始扫描console.log("开始扫描");那。开始扫描();scan.onmarked=onmarked函数onmarked(type,result,file){switch(type){caseplus.barcode.QR:type='QR'breakcaseplus.barcode.EAN13:type='EAN13'breakcaseplus.barcode.EAN8:type='EAN8'breakdefault:type='other'+typebreak}console.log("扫描数据",type,result,file);result=result.replace(/\n/g,'')alert(result)//关闭scan.close();}},就是这样!!