uniapp使用uQRCode插件生成二维码的简单使用

最近在找移动端绘制二维码的问题 ,直接上代码
下载 weapp-qrcode.js(可以通过npm install weapp-qrcode --save 下载,之后把它父子到untils目录下)

	npm install weapp-qrcode --save

在组件页面使用

<canvas id="couponQrcode" canvas-id="couponQrcode"  style="width:380rpx; height: 380rpx"></canvas>
<script>//引入const qrCode = require('@/untils/weapp-qrcode.js');data() {return {QrCode:""//二维码地址}},methods:{init(){//假设后台返回的数据res={url:'',//二维码地址}this.QrCode=res.url;this.setCode()},setCode(){this.$nextTick(() => {const rpx2px = this.createRpx2px();let that=thisnew qrCode('couponQrcode', {text: this.QrCode,//必须,二维码内容width: rpx2px(190 * 2),//必须,二维码宽度height: rpx2px(190 * 2),//必须,二维码高度colorDark: '#000000',colorLight: '#FFFFFF',correctLevel: qrCode.CorrectLevel.L, // 非必须,二维码纠错级别,默认值为高级,取值:{ L: 1, M: 0, Q: 3, H: 2 }});}},// 自适应转成rpxcreateRpx2px() {const { windowWidth } = uni.getSystemInfoSync();return function (rpx) {return (windowWidth / 750) * rpx;};},},}
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/648101.shtml

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

相关文章

非线性数据结构

非线性数据结构 set集合 ①有序不重复 set ②有序可重复 multiset ③无序不重复 unordered_set ④无序可重复 unordered_multiset 有序省内存 无序省时间 //头文件 #include <set> #include <unordered_set> //构造 set<int> set1{1,2,3};//有序不重复 mul…

Spring Boot3整合MyBatis Plus

目录 1.前置条件 2.导坐标 3.配置数据源 4.mybatis-plus基础配置 5.配置mapper扫描路径 6.MyBatis Plus代码生成器整合 1.导坐标 2.编写代码生成逻辑 7.整合Druid连接池 1.前置条件 已经初始化好一个spring boot项目且版本为3X&#xff0c;项目可正常启动 初始化教程…

昂首资本闪耀石家庄交易技术峰会,尽释行业进取之姿

“2024年石家庄交易技术峰会”在中国河北石家庄举办&#xff0c;Anzo Capital昂首资本作为2024年交易峰会的独家赞助商出席本次活动&#xff0c;Anzo Capital 魄力超前&#xff0c;尽显行业进取之姿。 “开门红”——作为2024年的首场交易技术峰会&#xff0c;“石家庄交易技术…

幻兽帕鲁专用服务器设置,与好友畅玩

创建幻兽帕鲁服务器1分钟部署教程&#xff0c;阿里云和腾讯云均推出幻兽帕鲁服务器专属优惠服务器和部署教程&#xff0c;4核16G和4核32G配置可选&#xff0c;阿腾云atengyun.com分享1分钟自建幻兽帕鲁Palworld服务器教程&#xff0c;附阿里云和腾讯云专属幻兽帕鲁优惠价格表&a…

openssl3.2/test/certs - 061 - other@good.org not permitted by CA1

文章目录 openssl3.2/test/certs - 061 - othergood.org not permitted by CA1概述笔记END openssl3.2/test/certs - 061 - othergood.org not permitted by CA1 概述 openssl3.2 - 官方demo学习 - test - certs 笔记 /*! * \file D:\my_dev\my_local_git_prj\study\openSS…

DAY10_SpringBoot—SpringMVC重定向和转发RestFul风格JSON格式SSM框架整合Ajax-JQuery

目录 1 SpringMVC1.1 重定向和转发1.1.1 转发1.1.2 重定向1.1.3 转发练习1.1.4 重定向练习1.1.5 重定向/转发特点1.1.6 重定向/转发意义 1.2 RestFul风格1.2.1 RestFul入门案例1.2.2 简化业务调用 1.3 JSON1.3.1 JSON介绍1.3.2 JSON格式1.3.2.1 Object格式1.3.2.2 Array格式1.3…

cocos creator 碰撞系统

设置碰撞组件 * 添加组件中添加碰撞组件 3种组件类型&#xff0c;矩形碰撞&#xff0c;圆形碰撞&#xff0c; 多边形碰撞 开启碰撞检测 start() {//开启碰撞管理器let cm cc.director.getCollisionManager()cm.enabled true//绘制碰撞检测边界线。用于调试cm.enabledDebug…

01 Redis的特性+下载安装启动

1.1 NoSQL NoSQL&#xff08;“non-relational”&#xff0c; “Not Only SQL”&#xff09;&#xff0c;泛指非关系型的数据库。 键值存储数据库 &#xff1a; 就像 Map 一样的 key-value 对。如Redis文档数据库 &#xff1a; NoSQL 与关系型数据的结合&#xff0c;最像关系…

GUN/Linux时间同步服务之chrony配置管理

风险告知 本人及本篇博文不为任何人及任何行为的任何风险承担责任&#xff0c;图解仅供参考&#xff0c;请悉知&#xff01;相关配置操作是在一个全新的演示环境下进行的&#xff0c;演示环境中没有任何有价值的数据&#xff0c;但这并不代表摆在你面前的环境也是如此。生产环境…

Java 8中使用Stream来操作集合

如何在Java 8中使用Stream来操作集合&#xff1f; 在Java 8中&#xff0c;你可以使用Stream API来操作集合。Stream API是Java 8引入的一种新特性&#xff0c;它允许你以声明性方式处理数据集合&#xff0c;如对集合进行过滤、映射、排序等操作。 以下是一些基本的Stream操作…

ICMP协议详解

ICMP&#xff08;Internet Control Message Protocol&#xff09;协议是一个网络层协议。 一个新搭建好的网络&#xff0c;往往需要先进行一个简单的测试&#xff0c;来验证网络是否畅通&#xff1b;但是IP协议并不提供可靠传输。如果丢包了&#xff0c;IP协议并不能通知传输层…

QY-18A 远程倾斜位移监测仪

产品概述 远程倾斜位移监测仪具有体积小、精度高、安装方便、功能完备等优势&#xff0c;可对被测物进行实时的监测&#xff0c;兼具自动化、云模式、高精度。能根据对设备自身的X、Y、Z三个方向的姿态倾斜状况进行实时监测&#xff0c;测量出监测点的相对位移量和方位角&…

Java中Integer(127)==Integer(127)为True,Integer(128)==Integer(128)却为False,这是为什么?

文章目录 1.前言2. 源码解析3.总结 1.前言 相信大家职业生涯中或多或少的碰到过Java比较变态的笔试题&#xff0c;下面这道题目大家应该不陌生&#xff1a; Integer i 127; Integer j 127;Integer m 128; Integer n 128;System.out.println(i j); // 输出为 true System.o…

阿里云之申请云服务器

阿里云注册建议使用支付宝扫码。 点击产品&#xff0c;勾选个人认证&#xff0c;云服务器。选择第二个。第一个会自动给你续费&#xff0c;第二个不会。 以下配置&#xff0c;只要是博主没说的都可以根据初始选项选择。&#xff08;不用管&#xff09; 地域&#xff1a;选择与…

嵌入式软件工程师面试题——2025校招社招通用(C/C++)(三十九)

说明&#xff1a; 面试群&#xff0c;群号&#xff1a; 228447240面试题来源于网络书籍&#xff0c;公司题目以及博主原创或修改&#xff08;题目大部分来源于各种公司&#xff09;&#xff1b;文中很多题目&#xff0c;或许大家直接编译器写完&#xff0c;1分钟就出结果了。但…

C语言实现“空心”正方形图案输出的程序解析

我们可以利用循环结构和条件判断语句来绘制各种图形。下面&#xff0c;我将对一个通过while循环和嵌套for循环实现“空心”正方形输出的C语言代码进行详细解析。 #include <stdio.h>int main() {int a;while (scanf("%d", &a) ! EOF) { // 输入循环&#…

Unknown encoder ‘libmp3lame

环境&#xff1a; macos m1 &#xff0c; python3.10.x 背景 做视频切片&#xff0c; 使用moviepy 中VideoFileClip进行截取视频。 报错&#xff1a; Unknown encoder libmp3lameThe audio export failed because FFMPEG didnt find the specified codec for audio encoding …

【ARMv8M Cortex-M33 系列 7 -- RA4M2 移植 RT-Thread 问题总结】

请阅读【嵌入式开发学习必备专栏 】 文章目录 问题小结栈未对齐 经过几天的调试&#xff0c;成功将rt-thead 移植到 RA4M2&#xff08;Cortex-M33 核&#xff09;上&#xff0c;thread 和 shell 命令已经都成功支持。 问题小结 在完成 rt-thread 代码 Makefile 编译系统搭建…

Django开发_19_form表单前后端关联(1)

实例分析&#xff0c;过程使用URL反向解析知识&#xff1a; Django开发_12_URL反向解析、重定向-CSDN博客y 一、实例代码 (一)主路由urls.py: path("work4/", include("work4_app.urls",namespace"work4")), (二)app内urls.py: from djang…

利用大数据靶向肿瘤细胞的基因突变

在亚利桑那健康科学大学&#xff0c;研究人员正在应用大量数据&#xff0c;试图更多地了解这种突变、其变异以及任何可能有助于他们治疗患者的相关因素。 癌症的潜在原因很多&#xff0c;从食物和环境到创伤和感染。在遗传学方面&#xff0c;研究人员发现&#xff0c;有一种基因…