uniapp二维码与背影图片并分享微信或朋友圈

兄弟连勇闯天涯

于 2019-05-09 11:30:06 发布

阅读量6.2k

点赞数 3

分类专栏： uni-app web前端

本文链接：https://blog.csdn.net/endianzhijia/article/details/90025424

版权

本人是前端小白一枚。代码粗糙。如果对你有用。请帮我点一赞谢谢。

在这里插入图片描述

1.准备好二维码的插件和指定的背影图片

在这里插入图片描述

2.从服务器端获取二维码的信息（该分享用户的信息）

getyq() {
	let that = this;
		var option = {};
		option.url = 'user/Profile/get_invitation_url';
		option.success = function(res) {
			if (res.code) {
			    // 给二维码赋值相应的信息
				that.qrval = res.data
               
			} 
		};
		option.fail = function(res) {
			uni.showToast({title: '网络异常'});
		};
		util.ajaxGet(option);
	},

在这里插入图片描述

生成二维码
creatQrcode() {
				this.$refs.qrcode._makeCode();
			},

3.调取合并图片的组件。（这里是用canvas将二维码与图片合成一张图片）
在这里插入图片描述

//从二维码那里获取二维码的图片放在合成组件当中
			result1(data) {
				this.img2 = {
					src: data,
					width: 100,
					height: 100,
					top: uni.getSystemInfoSync().screenHeight - 180,
					left: uni.getSystemInfoSync().screenWidth - 230