注:本文使用的是 uniapp 语法。

微信小程序提供了扫码API:wx.scanCode,但它只能扫一次码,想要实现连续扫码,需要借用 camera 组件。camera 组件不仅能拍照,还具有扫码功能,只要将它的 mode 属性设置为 scanCode,就会在扫码识别成功时触发 bindscancode 事件(在 uniapp 中是 scancode 事件)。

<camera mode="scanCode" device-position="back" flash="off"  @scancode="takeCode"></camera>

在 takeCode 函数里对扫码结果进行处理:

takeCode: (e) => {
if(scanFunctionIsUseable) {
this.scanFunctionIsuseable = false;
// 对扫码结果进行处理
console.log(e.detail.result); // 扫码间隔两秒
setTimeout(() => {
this.scanFunctionIsUseable = true;
}, 2000)
}
}

需要注意的是,摄像头对着码时,会重复扫描多次,这显然不是我们想要的。为了避免这种情况,可以增加一个 scanFunctionIsUseable 标志位,在扫码成功时令它为 false,隔两秒令它为 true,这样就可以隔两秒再去处理扫码结果。

参考:https://blog.csdn.net/du771278794/article/details/86219165

微信小程序实现连续扫码功能(uniapp)的更多相关文章

  1. 微信小程序一键生成源码 在线制作定制功能强大的微信小程序

    微信小程序发展到现在,短短的一年不到的时间(很快就要迎来微信小程序周年庆),在快迎来周年庆之际,百牛信息技术bainiu.ltd特记录一下这个发展的历程,用于将来见证小程序发展的辉煌时刻,我们还能知道 ...

  2. 从微信小程序开发者工具源码看实现原理(一)- - 小程序架构设计

    使用微信小程序开发已经很长时间了,对小程序开发已经相当熟练了:但是作为一名对技术有追求的前端开发,仅仅熟练掌握小程序的开发感觉还是不够的,我们应该更进一步的去理解其背后实现的原理以及对应的考量,这可能 ...

  3. 记录使用微信小程序的NFC和蓝牙功能读取15693芯片的开发历程

    开发目标: (1) 对于Android手机,直接通过微信小程序调用手机的NFC功能,对15693协议的芯片进行读写操作: (2)对于苹果手机(及没有NFC模块的手机),通过微信小程序的蓝牙功能连接到蓝 ...

  4. 基于微信小程序的用户列表点赞功能

    代码地址如下:http://www.demodashi.com/demo/13997.html 一.前言 (1).适合人群 1.微信小程序开发者 2.前端工程师 3.想入门学习小程序开发的人员 4.想 ...

  5. 从微信小程序开发者工具源码看实现原理(四)- - 自适应布局

    从前面从微信小程序开发者工具源码看实现原理(一)- - 小程序架构设计可以知道,小程序大部分是通过web技术进行渲染的,也就是最终通过浏览器的dom tree + cssom来生成渲染树:既然最终是通 ...

  6. 微信小程序开发抖音去水印功能

    之前找了很多抖音去水印的工具全是广告,所以索性自己写了一个,提供给大家免费试用以下是微信小程序的二维码 使用教程: 1.打开微信搜索小程序:沸点软件技术服务 2.打开沸点软件技术服务小程序 3.去抖音 ...

  7. Mockplus微信小程序上线!扫一扫轻松查看原型!

    Mockplus团队发布了Mockplus微信小程序. 从现在起,你无需下载Mockplus移动端,用微信扫一扫二维码,即可在微信中打开并查看原型.Mockplus微信小程序,无需安装.卸载,不占用手 ...

  8. 又是新动作!微信小程序专属二维码出炉

    又到了晚上,微信又给我们带来了惊喜,并这次不是新的能力,而是把大家再熟悉不过的二维码换了新的造型. 正式揭晓:微信特制的小程序码.扫一扫新二维码 只要你的微信升级到了 6.5.7 版本,就可以扫码或者 ...

  9. 微信小程序之换肤的功能

    pc或者移动端实现换肤功能还是比较简单的,大致就是需要换肤的css,还有正常的css:把当前皮肤类型存入本地:然后通过js读取并判断当前应该加载哪套css. 由于微信小程序没有操作wxss的api,所 ...

随机推荐

  1. ESlint中console.log报错问题

    ESlint中console.log报错问题 由于ESlint规范化,导致console.log的使用也会报错,下面是设置允许console.log控制台输出 描述:打开 package.json 文 ...

  2. 51Nod - 1255

    也是第十一届校赛的C题,不过他把1e5改成了1e7. 一开始就想到用贪心做.思路是这样的:开一个字符数组ans保存答案.然后从头到尾遍历题目给出的字符串S,如果ans数组中还没有这个字母,那么就把字母 ...

  3. Pyqt5_QMessageBox

    QMessageBox header:会话窗标题 info:会话窗内容 #弹出5种不同类型的消息框 reply1=QMessageBox.information(self,"title&qu ...

  4. 微信小程序制作个人简历

    使用微信小程序云开发制作自己的个人简历,简单高效. 首先需要了解小程序的基本结构以及云开发模式,及一些css样式基础. 使用小程序云数据库.vant组件库实现简历内容. 最终效果如下: 首先申请个人微 ...

  5. var、let、const三者的区别

    var定义的变量,没有块的概念,可以跨块访问, 不能跨函数访问. let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问. const用来定义常量,使用时必须初始化(即必须赋值),只能 ...

  6. 学会使用Hdlbits网页版Verilog代码仿真验证平台

    给大家推荐一款网页版的 Verilog代码编辑仿真验证平台,这个平台是国外的一家开源FPGA学习网站,通过“https://hdlbits.01xz.net/wiki/Main_Page” 地址链接进 ...

  7. centOS 6.8下使用Gparted进行分区扩容

    centOS 6.8下使用Gparted进行分区扩容 ​ 机器环境:windows上运行的VMware虚拟机,系统为centOS 6.8. ​ 由于前期分区分配空间过小,无法满足后续的数据存储预期,所 ...

  8. Robot Framework(12)- 详细解读 RF 的变量和常量

    如果你还想从头学起Robot Framework,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1770899.html 常量的栗子 常量 ...

  9. C#基础之方法的重载

    在C#语言中,方法的重载作用非常大,但是使用重载需要注意方法的签名,必须有一种要不一样,具体指的是: 1.方法的返回值类型 2.方法的形参类型 3.形参类型的顺序 4.形参的个数 4.泛型的类型< ...

  10. word修改页眉使本页的页眉与别的页不一样

    关键回答:双击要修改的页的页眉,word顶端的工具栏“页面设置”当中的“链接到前一个”选项不要选中,即可修改本页页眉使之与别的页不一样. 详见:https://iask.sina.com.cn/b/2 ...