当前位置: 首页 > news >正文

uqrcode+uni-app 微信小程序生成二维码

使用微信小程序需要弹出动态二维码的需求,从插件市场选了一个下载次数较多的组件引入到项目中uqrcode,使用步骤如下:

1、从插件市场下载

插件地址:https://ext.dcloud.net.cn/plugin?id=1287,若你是跟我一样是用uni-app开发微信小程序的,则该插件的介绍只需要看下面的即可,上面是作者介绍用于原生开发中。

2、引入

下载好后,按照下面方式引入

<uqrcode ref="uqrcode" canvas-id="qrcode" value="https://uqrcode.cn/doc" :options="{ margin: 10 }"></uqrcode>

上述是二维码的内容, 我是写在popup

<uni-popup id="popupQrcode" ref="popupQrcode" type="center" :animation="true"><uqrcode ref="uqrcodepop" canvas-id="qrcode" :value="qrcodeUrl" :options="{ margin: 10 }" :size="300":loading="qrcodeLoading" @complete="qrchange($event)"></uqrcode>
</uni-popup>

(按照自己的需要引入即可)

下图是关于uni-app使用的关键部分:
在这里插入图片描述
注意:若微信开发者工具提示 uqrcode is undefined 类似这样子的错误提示,需要重启开发者工具,或者停止运行再重新启动,重启后便没有该错误提示了。

3、文档

除了简单使用之外,若有进一步要求,比如显示loading、二维码大小、重新生成二维码、点击事件、下载保存等需求,可在此基础上添加事件和方法即可,文档地址:https://uqrcode.cn/doc/document/uni-app.html

qrchange(e) {if (e.success) {console.log('生成成功');_this.qrcodeLoading = false;} else {console.log('生成失败');_this.qrcodeLoading = false;} 
},
http://www.lryc.cn/news/172932.html

相关文章:

  • 从零开始的 MyBatis 拦截器之旅:实战经验分享
  • 网络编程day05(IO多路复用)
  • 人声分离网站,帮你快速提取视频中的人声和背景音乐
  • 计算机网络常见问题
  • 上PICO,沉浸式观看亚运直播,参与跨国界游戏竞技
  • 无重复字符的最长子串 - 力扣(LeetCode)
  • 企业行政许可的种类有哪些?
  • Flink--4、DateStream API(执行环境、源算子、基本转换算子)
  • #循循渐进学51单片机#指针基础与1602液晶的初步认识#not.11
  • Lua学习笔记:探究package
  • 【面试经典150 | 双指针】三数之和
  • 现代卷积网络实战系列3:PyTorch从零构建AlexNet训练MNIST数据集
  • Django系列:Django应用(app)的创建与配置
  • Linux查看程序和动态库依赖的动态库
  • vue3 无法使用pnpm安装依赖 或 Cannot find module preinstall.js
  • C/C++连接数据库,包含完整代码。
  • AUTOSAR词典:CAN驱动Mailbox配置技术要点全解析
  • C语言 coding style
  • Python办公自动化之PDF
  • 【每日一题Day331】LC2560打家劫舍 IV | 二分查找 + 贪心
  • JVM 参数详解
  • uni-app获取地理位置
  • Learn Prompt-Prompt 高级技巧:思维链 Chain of Thought Prompting
  • Vim编辑器使用入门
  • 早餐与风景
  • 常用python代码串
  • 电脑桌面透明便签软件是哪个?
  • Git创建干净分支,本地操作不依赖任何分支
  • sqlmap tamper脚本编写
  • 5.5V-65V Vin同步降压控制器,具有线路前馈SCT82630DHKR