uniapp中根据URL链接生成二维码（适用所有Javascript运行环境的前端应用）,保存二维码到本地相册。

组件地址

官方文档：https://uqrcode.cn/doc。

github地址：https://github.com/Sansnn/uQRCode。

npm地址：https://www.npmjs.com/package/uqrcodejs。

uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id=1287。

1、uni-app示例

Template部分

<canvas id="qrcode" canvas-id="qrcode" style="width: 200px;height: 200px;"></canvas>

JS部分

onReady() {// 获取uQRCode实例var qr = new UQRCode();// 设置二维码内容qr.data = "https://uqrcode.cn/doc";// 设置二维码大小，必须与canvas设置的宽高一致qr.size = 200;// 调用制作二维码方法qr.make();// 获取canvas上下文var canvasContext = uni.createCanvasContext('qrcode', this); // 如果是组件，this必须传入// 设置uQRCode实例的canvas上下文qr.canvasContext = canvasContext;// 调用绘制方法将二维码图案绘制到canvas上qr.drawCanvas();
}

模板示例

还有一些其他示例，自己查看。

组件查看

HTML示例、使用js操作dom进行绘制或是使用svg绘制等

导出临时文件路径
原生方式基于Canvas的

2、保存二维码到本地相册

安装uqrcode组件后，在template中键入。设置ref属性可使用组件内部方法，canvas-id属性为组件内部的canvas组件标识，value属性为二维码生成对应内容，options为配置选项，可配置二维码样式，绘制Logo等

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

保存二维码到本地相册
为了保证方法调用成功，请在 complete 事件返回success=true后调用。

// uqrcode为组件的ref名称
this.$refs.uqrcode.save({success: () => {uni.showToast({icon: 'success',title: '保存成功'});}
});

uniapp中根据URL链接生成二维码（适用所有Javascript运行环境的前端应用）,保存二维码到本地相册。相关推荐

Android 通过URL scheme 实现点击浏览器中的URL链接，启动特定的App，并调转页面传递参数...
点击浏览器中的URL链接,启动特定的App. 首先做成HTML的页面,页面内容格式如下: <a href="[scheme]://[host]/[path]?[query]" ...
PB中打开url链接
PB中打开url链接公司项目中,第三方发来个说明,说是要通过打开url连接地址的方式,将参数传给对方的平台,参数的封装采用Json格式, 百度了一通,看了网友们的方法,发现pb中有个inet控件可以 ...
mac 建立软链接_Mac中创建URL链接文件 | 玩转苹果
在Windows中,可以通过快捷方式的方法创建一个网址的链接,那么在Mac OS X中要如何创建呢? 其实在Mac中保存一个网址的链接到一个文件中很简单,通过拖拽浏览器地址栏左侧的网址图标到桌面上即可 ...
CATIA CAA二次开发---------建立用例运行环境
大家知道,CATIA系统复杂程度高,功能丰富, CAA开发,除了随系统提供的百科全书(Encyclopedia)外,很难找到系统的资料参考和学习.所以,认真学习.分析这个Encyclopedia,是我 ...
前端页面直接根据URL链接生成二维码【亲测可用】
1安装qrcodejs2 npm install qrcodejs2 -save 实操:Terminal下执行 2在所需要的前端页面中引入[找到qrcode.js直接拉到页面中] 或者 import ...
使用IDEA创建一个通过url链接生成二维码的java程序|自动生成二维码
平时使用了那么多的二维码,今天我们自己做一个二维码.今天刚安装了IDEA,学会了用法,就来通过IDEA做一个生成二维码的程序. 首先新建一个项目设置项目名称点击Next之后,出现下图所示页面: ...
java上传图片到阿里云oss云存储中,返回url链接地址
https://blog.csdn.net/baidu_38990811/article/details/78413470
php用json交换二维数组,PHP和Javascript的JSON交互（处理一个二维数组）
我不得不承认:我是一个彻彻底底的JS白痴.但根据项目需要,不得不使用JSON,不管怎么说,经过一个晚上的学习,已经略有所成,记录下来. PHP的JSON类库我使用的是Services_JSON,没什么 ...
简述在虚拟机中安装 centos 的过程_从零构建Fabric开发运行环境手册（一）：安装OS虚拟机(CentOS)...
本手册将从虚拟机开始,到搭建出一个基于Hyperledger Fabric 1.4开发区块链应用的环境. 本小节介绍一下如何自行安装CentOS 7.x虚拟机.自己从零开始安装的一个好处是,了解完整的 ...