uniapp+vue3小程序点击保存图片、保存二维码

介绍

步骤1：引入必要的API

在script部分，确保引入了uni的相关API，如uni.downloadFile和uni.saveImageToPhotosAlbum。

步骤2：下载图片到本地

在toInvite函数中，使用uni.downloadFile将图片下载到本地，并获取本地路径。

步骤3：处理权限和保存逻辑

在saveToAlbum函数中，首先检查用户是否已经授权保存到相册。如果已经授权，则直接调用uni.saveImageToPhotosAlbum保存图片。如果未授权，则引导用户进行授权。

步骤4：更新模板中的按钮事件

确保按钮的@click事件绑定到toInvite函数。

步骤5：测试功能

运行小程序，点击“保存邀请二维码”按钮，测试图片是否成功下载并保存到相册。注意处理各种可能的错误情况，并给出相应的用户提示。

代码

<template><view class="memberBox"><view class="inviCode"><image src="/static/images/index/memberBg.png" mode="aspectFill" class="bgImg"></image><!-- 二维码 --><view class="qrcode"><image :src="i.image(qrcode)" mode="aspectFill"></image></view><view class="tips">扫码即可加入</view></view><view class="btn" @click="toInvite">保存邀请二维码</view>