案例演示：
后台假设返回123的数据，我们对将其生成二维码并且以弹框的形式显示出来。均封装成组件，谁用谁引。文章来源地址https://www.toymoban.com/news/detail-691330.html
案例代码
1.uqrcode组件，生成canvas：
<template>
<view>
<canvas class="qrcode" id="qrcode" canvas-id="qrocde" type="2d" style="width: 750px;height: 750px;"></canvas>
</view>
</template>
<script>
import UQRCode from '@/common/uqrcode.js'
export default {
name: "uqrcode",
props: {
text: {
type: String,
default: ''
}
},
methods: {
async init() {
let qrcodeCanvas = await this.getMyCanvasAndCtx('qrcode');
console.log(qrcodeCanvas)
// console.log(qrcodeCanvas)
// 获取uQRCode实例
var qr = new UQRCode();
// 设置二维码内容
qr.data = this.text;
// 设置二维码大小，必须与canvas设置的宽高一致
qr.size = 750;
// qr.useDynamicSize = true
qr.margin = 24
// // 调用制作二维码方法
qr.make();
// // 获取canvas元素
qr.canvasContext = qrcodeCanvas.ctx;
// 调用绘制方法将二维码图案绘制到canvas上
qr.drawCanvas().then(async () => {
let tempFilePathRes = await this.$common.apiPromise('canvasToTempFilePath', 文章来源：https://www.toymoban.com/news/detail-691330.html
到了这里，关于uni——小程序二维码生成的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
