lishang/pages/user/shareQrCode.vue

<template>
	<view class="container">
		<image @longtap="bc_code" class="backImg" :src="backImg"></image>
		<view class="tki-qrcode"><canvas @longtap="bc_code" canvas-id="qrcode" /></view>
	</view>
</template>

<script>
	import {
		spreadBanner
	} from '@/api/user.js';
	export default {
		// components: { tkiQrcode },
		data() {
			return {
				url: '',
				backImg: '',

			};
		},
		onLoad() {
			this.bc_code()
		},

		methods: {
			bc_code() {
				let that = this;
				console.log('保存二维码', this.backImg)
				uni.downloadFile({ //获得二维码的临时地址
					//需要一个url保存img的地址
					url: this.backImg,
					success: (res) => {
						//console.log('获取url',res)
						if (res.statusCode == 200) {
							//保存图片到系统相册，上面uni.是临时保存，现在是永久保存到系统相册
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath, //传入临时地址
								success() {
									that.$api.msg('保存成功') //封装的提示
								},
								fail() {
									that.$api.msg('保存失败')
								}
							})
						}
					}
				})
			},
			//显示保存临时地址，保存成功后会保存到系统地址永久保存
			// bc_code() {
			// 	uni.downloadFile(
			// 		//找一个容器保存拿到的地址
			// 		{
			// 			url: this.backImg,
			// 			success:(res)=>{
			// 				console.log(res,'111')
			// 				if(res.statusCode == 200){
			// 					//如果状态码为200说明有，可以保存成功
			// 					uni.saveImageToPhotosAlbum({
			// 						filePath:res.tempFilePath,//传入临时地址
			// 						success() {
			// 							this.$api.msg('保存成功')
			// 						},
			// 						fail(){
			// 							this.$api.msg('保存失败')
			// 						}
			// 					})
			// 				}
			// 			}
			// 		}
			// 	)
			// }
		},
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		min-height: 100%;

		.container {
			width: 100%;
			height: 100%;
		}
	}

	.backImg {
		position: absolute;
		width: 100%;
		height: 100%;
	}



	canvas {
		width: 150px;
		height: 150px;
		margin: auto;

	}
</style>