码迷,mamicode.com
首页 > 微信 > 详细

微信小程序点击保存图片到相册

时间:2019-07-14 19:38:15      阅读:425      评论:0      收藏:0      [点我收藏+]

标签:gets   set   use   ast   微信   photo   toast   enter   direction   

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
})
}
})
}
})
}

微信小程序点击保存图片到相册

标签:gets   set   use   ast   微信   photo   toast   enter   direction   

原文地址:https://www.cnblogs.com/Annely/p/11185210.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!