微信小程序点击保存图片到相册
Posted annely
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了微信小程序点击保存图片到相册相关的知识，希望对你有一定的参考价值。
wxml部分的代码
<view class="footer-r" bindtap="save">
<image src="../../../images/icons/zhiwen.svg" />
<view class="footer-r-t">
<text>点击保存到相册</text>
<text class="t">享更多优惠</text>
</view>
</view>
wxsl部分的代码
.footer-r
width: 50%;
display: flex;
flex-direction: column;
.footer-r image
margin: 0 auto;
width: 180rpx;
height: 180rpx;
.footer-r-t
margin-left: 20rpx;
font-size: 26rpx;
padding-top: 20rpx;
display: flex;
flex-direction: column;
text-align: center;
js部分的代码
//点击保存图片
save()
let that = this
//若二维码未加载完毕，加个动画提高用户体验
wx.showToast(
icon: ‘loading‘,
title: ‘正在保存图片‘,
duration: 1000
)
//判断用户是否授权"保存到相册"
wx.getSetting(
success(res)
//没有权限，发起授权
if (!res.authSetting[‘scope.writePhotosAlbum‘])
wx.authorize(
scope: ‘scope.writePhotosAlbum‘,
success() //用户允许授权，保存图片到相册
that.savePhoto();
,
fail() //用户点击拒绝授权，跳转到设置页，引导用户授权
wx.openSetting(
success()
wx.authorize(
scope: ‘scope.writePhotosAlbum‘,
success()
that.savePhoto();
)
)
)
else //用户已授权，保存到相册
that.savePhoto()
)
,
//下载图片地址并保存到相册，提示保存成功
savePhoto()
let that = this
wx.downloadFile(
// 图片下载地址
url: ‘https://bhb.hvateng.com/public/static/baiheba/img/qrcode344.jpg‘,
// url: app.apiUrl.url + ‘Userequity/poster‘,
success: function(res)
wx.saveImageToPhotosAlbum(
filePath: res.tempFilePath,
success(res)
wx.showToast(
title: ‘保存成功‘,
icon: "success",
duration: 1000
)
)
)
以上是关于微信小程序点击保存图片到相册的主要内容，如果未能解决你的问题，请参考以下文章