uniapp 实现本地二维码 二维码中间增加图片不显示(显示白块)

使用 uni.getImageInfo({ }) 转化 将 图片地址转化成本地预览地址

javascript 复制代码
		initUrqCode(){
			// let logo = 'http://mujiachaoshi.kiss55.com/78aca7812fd801f8e6d4d4482af70d38'
			uni.getImageInfo({
			  src: this.user.photo,
			  success: (res) => {
					// 获取uQRCode实例
					var qr = new UQRCode();
					// 设置二维码内容
					qr.data = "1";
					// 设置二维码大小,必须与canvas设置的宽高一致
					qr.size = 200;
					
					qr.foregroundImageSrc = res.path;
					// qr.foregroundImageWidth = '50';
					// qr.foregroundImageHeight = '50';
					
					// qr.areaColor = 'rgba(255,255,255,0)';
					qr.areaColor = '#ffffff';
					// qr.foregroundImageBackgroundColor = '#eeffff';
					// qr.backgroundColor = 'rgba(0,0,0,0)'
					// qr.typeNumberBackgroundColor = 'rgba(0,0,0,0)'
					
					// 调用制作二维码方法
					qr.make();
					// 获取canvas上下文
					var canvasContext = uni.createCanvasContext('qrcode', this); // 如果是组件,this必须传入
					// 设置uQRCode实例的canvas上下文
					qr.canvasContext = canvasContext;
					// 调用绘制方法将二维码图案绘制到canvas上
					qr.drawCanvas();
			  },
			  fail: (err) => {
			    console.log('图片加载失败', err);
			  }
			});
		},
相关推荐
Evan东少2 天前
[踩坑]笔记本Ubuntu20.04+NvidiaRTX5060驱动+cuda+Pytorch+ROS/Python实现人脸追踪(环境准备)
1024程序员节
不爱编程的小陈4 天前
C/C++每日面试题
面试·职场和发展·1024程序员节
开开心心就好4 天前
右键菜单管理工具,添加程序自定义名称位置
linux·运维·服务器·ci/cd·docker·pdf·1024程序员节
码农三叔5 天前
(4-2-05)Python SDK仓库:MCP服务器端(5)Streamable HTTP传输+Streamable HTTP传输
开发语言·python·http·大模型·1024程序员节·mcp·mcp sdk
西幻凌云9 天前
初始——正则表达式
c++·正则表达式·1024程序员节
启芯硬件9 天前
电源XL6009E1的dieshot细节分析-芯片设计干货
大数据·经验分享·硬件工程·1024程序员节
一颗青果11 天前
单例模式 | 死锁
linux·服务器·单例模式·1024程序员节
yBmZlQzJ13 天前
财运到内网穿透域名解析技术机制与中立评估
运维·经验分享·docker·容器·1024程序员节
yBmZlQzJ13 天前
内网穿透工具通过端口转发实现内外网通信
运维·经验分享·docker·容器·1024程序员节