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.hqwc.cn/news/115361.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

八大排序(四)--------直接插入排序

本专栏内容为&#xff1a;八大排序汇总 通过本专栏的深入学习&#xff0c;你可以了解并掌握八大排序以及相关的排序算法。 &#x1f493;博主csdn个人主页&#xff1a;小小unicorn ⏩专栏分类&#xff1a;八大排序汇总 &#x1f69a;代码仓库&#xff1a;小小unicorn的代码仓库…

蓝牙低功耗BLE调研与开发

蓝牙低功耗BLE调研与开发 一&#xff1a; 蓝牙简介 蓝牙是一种近距离无线通信技术&#xff0c;运行在2.4GHz免费频段&#xff0c;它的特性就是近距离通信&#xff0c;典型距离是 10 米以内&#xff0c;传输速度最高可达 24 Mbps&#xff0c;支持多连接&#xff0c;安全性高&a…

在编译源码的环境下,搭建起Discuz!社区论坛和WordPress博客的LNMP架构

目录 一.编译安装nginx 二.编译安装MySQL 三.编译安装PHP 四.安装论坛 五.安装wordpress博客 六.yum安装LNMP架构&#xff08;简要过程参考&#xff09; 一.编译安装nginx 1&#xff09;关闭防火墙&#xff0c;将安装nginx所需软件包传到/opt目录下 systemctl stop fire…

基础算法--前缀和与差分

1、前缀和 前缀和是指某序列的前n项和&#xff0c;可以把它理解为数学上的数列的前n项和&#xff0c;而差分可以看成前缀和的逆运算。合理的使用前缀和与差分&#xff0c;可以将某些复杂的问题简单化。 2、前缀和算法有什么好处&#xff1f; 先来了解这样一个问题&#xff1a;…

STM32 定时器介绍--基本定时器

目录 基本定时器 1.功能框图 1-时钟源 2-控制器 3-时基单元 4-影子寄存器 2.定时时间的计算 3.时基初始化结构体 4.实验设计 1-配置时基初始化结构体 2-开启定时器更新中断&#xff08;即定时时间到了&#xff09; 3-编写main函数 在我之前文章中说过一个系统定时器…

使用Visual Leak Detector排查内存泄漏问题

目录 1、VLD工具概述 2、下载、安装VLD 2.1、下载VLD 2.2、安装VLD 3、VLD安装目录及文件说明 3.1、安装目录及文件说明 3.2、关于32位和64位版本的详细说明 4、在工程中引入VLD 5、内存泄漏检测实例讲解 5.1、程序启动报错 5.2、启动调试&#xff0c;查看内存泄漏报…

推荐几款实用的项目进度管理软件

做好项目的进度管理是项目经理的重要职责&#xff0c;在这个过程中&#xff0c;并非单凭人力就可以把控。项目进度管理软件出现&#xff0c;成为人们在项目管理过程中最需要的工具之一。一个项目无论大小&#xff0c;都需要一款高效且实用的项目管理工具&#xff0c;对项目流程…

actf_2019_babystack

actf_2019_babystack Arch: amd64-64-little RELRO: Partial RELRO Stack: No canary found NX: NX enabled PIE: No PIE (0x3ff000)64位&#xff0c;只开了nx __int64 __fastcall main(int a1, char **a2, char **a3) {char s[208]; // [rsp0h] [rbp-D…

华为云云耀云服务器L实例评测 |云服务器选购

华为云耀云服务器 L 实例是一款轻量级云服务器&#xff0c;开通选择实例即可立刻使用&#xff0c;不需要用户再对服务器进行基础配置。新用户还有专享优惠&#xff0c;2 核心 2G 内存 3M 带宽的服务器只要 89 元/年&#xff0c;可以点击华为云云耀云服务器 L 实例购买地址去购买…

leetcode25 K个一组反转链表

题目 给你链表的头节点 head &#xff0c;每 k 个节点一组进行翻转&#xff0c;请你返回修改后的链表。 k 是一个正整数&#xff0c;它的值小于或等于链表的长度。如果节点总数不是 k 的整数倍&#xff0c;那么请将最后剩余的节点保持原有顺序。 你不能只是单纯的改变节点内部…

计算机网络常见问题

1.谈一谈对OSI七层模型和TCP/IP四层模型的理解&#xff1f; 1.1.为什么要分层&#xff1f; 在计算机中网络是个复杂的系统&#xff0c;不同的网络与网络之间由于协议&#xff0c;设备&#xff0c;软件等各种原因在协调和通讯时容易产生各种各样的问题。例如&#xff1a;各物流…

阿里云大数据实战记录10:Hive 兼容模式的坑

文章目录 1、前言2、什么是 Hive 兼容模式&#xff1f;3、为什么要开启 Hive 模式&#xff1f;4、有什么副作用&#xff1f;5、如何开启 Hive 兼容模式&#xff1f;6、该场景下&#xff0c;能不能不开启 Hive 兼容模式&#xff1f;7、为什么不是DATE_FORMAT(datetime, string)&…