案例演示：
后臺假設(shè)返回123的數(shù)據(jù)，我們對將其生成二維碼并且以彈框的形式顯示出來。均封裝成組件，誰用誰引。文章來源地址http://www.zghlxwxcb.cn/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();
// 設(shè)置二維碼內(nèi)容
qr.data = this.text;
// 設(shè)置二維碼大小，必須與canvas設(shè)置的寬高一致
qr.size = 750;
// qr.useDynamicSize = true
qr.margin = 24
// // 調(diào)用制作二維碼方法
qr.make();
// // 獲取canvas元素
qr.canvasContext = qrcodeCanvas.ctx;
// 調(diào)用繪制方法將二維碼圖案繪制到canvas上
qr.drawCanvas().then(async () => {
let tempFilePathRes = await this.$common.apiPromise('canvasToTempFilePath', 文章來源：http://www.zghlxwxcb.cn/news/detail-691330.html
到了這里，關(guān)于uni——小程序二維碼生成的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
