feat(miniprogram): add local QR temp-file helper via uqrcodejs.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
wuzilongandCursor committed 2026-09-24 21:15:49 +08:00
1 parent b1719fab23
commit 8d0d301ead
3 files changed
+61

No files matched your search

+7
View File
@@ -11,6 +11,7 @@
"dependencies": {
"@vant/weapp": "^1.11.7",
"jsencrypt": "^3.5.4",
"uqrcodejs": "^4.0.7",
"vant": "^4.9.0"
},
"engines": {
@@ -313,6 +314,12 @@
"node": ">=0.10.0"
}
},
"node_modules/uqrcodejs": {
"version": "4.0.7",
"resolved": "https://registry.npmmirror.com/uqrcodejs/-/uqrcodejs-4.0.7.tgz",
"integrity": "sha512-84+aZmD2godCVI+93lxE3YUAPNY8zAJvNA7xRS7R7U+q57KzMDepBSfNCwoRUhWOfR6eHFoAOcHRPwsP6ka1cA==",
"license": "Apache-2.0"
},
"node_modules/vant": {
"version": "4.9.24",
"resolved": "https://registry.npmmirror.com/vant/-/vant-4.9.24.tgz",
+1
View File
@@ -15,6 +15,7 @@
"dependencies": {
"@vant/weapp": "^1.11.7",
"jsencrypt": "^3.5.4",
"uqrcodejs": "^4.0.7",
"vant": "^4.9.0"
},
"engines": {
+53
View File
@@ -0,0 +1,53 @@
import UQRCode from 'uqrcodejs'
/**
* 在组件内隐藏 canvas 上绘制二维码,导出临时文件路径供 <image> 展示。
* @param {object} opts
* @param {string} opts.text 二维码内容(出入库单 id)
* @param {string} opts.canvasId canvas-id
* @param {object} opts.componentInstance 组件实例(getCurrentInstance().proxy)
* @param {number} [opts.size=200]
* @returns {Promise<string>} tempFilePath
*/
export function makeQrTempFile({ text, canvasId, componentInstance, size = 200 }) {
const content = String(text || '').trim()
if (!content) {
return Promise.reject(new Error('二维码内容为空'))
}
if (!componentInstance) {
return Promise.reject(new Error('缺少组件实例'))
}
return new Promise((resolve, reject) => {
try {
const qr = new UQRCode()
qr.data = content
qr.size = size
qr.margin = 10
qr.make()
const ctx = uni.createCanvasContext(canvasId, componentInstance)
qr.canvasContext = ctx
qr.drawCanvas()
// drawCanvas 内部会 ctx.draw;稍延迟再导出
setTimeout(() => {
uni.canvasToTempFilePath(
{
canvasId,
width: size,
height: size,
destWidth: size,
destHeight: size,
success: (res) => {
if (res.tempFilePath) resolve(res.tempFilePath)
else reject(new Error('二维码导出失败'))
},
fail: (err) => reject(err || new Error('二维码导出失败'))
},
componentInstance
)
}, 120)
} catch (e) {
reject(e)
}
})
}