0
点赞
收藏
分享

微信扫一扫

Linux云计算 |【第二阶段】OPERATION-DAY5

Alex富贵 2024-08-18 阅读 26

1. 安装
1.1 通过npm安装,成功后即可使用import或require进行引用。
# npm安装
npm install uqrcodejs
# 或者
npm install @uqrcode/js
1.2 通过项目开源地址获取uqrcode.js,下载uqrcode.js后,将其复制到您项目指定目录,在页面中引入uqrcode.js文件即可开始使用。

2. 引入

通过import引入。

// npm安装
import UQRCode from 'uqrcodejs'; // npm install uqrcodejs
// 或者
import UQRCode from '@uqrcode/js'; // npm install @uqrcode/js

Node.js通过require引入。

// npm安装
const UQRCode = require('uqrcodejs'); // npm install uqrcodejs
// 或者
const UQRCode = require('@uqrcode/js'); // npm install @uqrcode/js

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

二维码成功生成!

举报

相关推荐

0 条评论