点击图片预览
长按图片保存
点击按钮保存到手机相册
view:
<!--wxml--> <text>点击图片预览、长按保存图片、点击按钮保存到系统相册</text> <image class="img" src="{{item}}" bindtap='previewImage' wx:for="{{src}}" wx:key="{{item.index}}"></image> <button bindtap='saveImg'>Save</button>
js:
Page({ /** * 页面的初始数据 */ data: { src: [ 'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg','http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg' ] }, /** * 长按预览保存图片到本地 */ previewImage:function(e){ var that = this; wx.previewImage({ current: that.data.src,//当前显示图片的http链接 urls: that.data.src, //要预览的图片 }) wx.getImageInfo({ src: that.data.src[0], success(res){ console.log(res) console.log(res.width) console.log(res.height) } }) }, /** * saveImg:点击按钮保存图片到本地 */ saveImg: function() { var imgSrc = "http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg" wx.downloadFile({ url: imgSrc, success: function(res) { console.log(res); //图片保存到本地 wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath,//图片文件路径 success(res){ //接口调用成功 wx.showToast({ title: '保存成功', duration:1000,//提示延迟时间 }) }, fail(err){ console.log(err) //需要用户授权设置 if (err.errMsg === "saveImageToPhotosAlbum:fail auth deny"){ console.log('用户一开始拒绝了,我们想再次发起授权') console.log('打开设置窗口') // 用户授权设置 wx.openSetting({ success(settingdata){ console.log(settingdata) if (settingdata.authSetting['scope.writePhotosAlbum']) { console.log('获取权限成功,给出再次点击图片保存到相册的提示。') } else { console.log('获取权限失败,给出不给权限就无法正常使用的提示') } } }) } } }) } }) }, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) { }, })
--------------------- 作者:Judy1623 来源:CSDN 原文:https://blog.csdn.net/weixin_39100915/article/details/82878867