本文主要是介绍【微信小程序】保存多张图片到本地相册 uni.saveVideoToPhotosAlbum保存视频 uni.saveImageToPhotosAlbum保存图片,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
<template><view class="container"><u-swiper :list="list" circular radius='0' indicator indicatorMode='dot' height='950rpx'></u-swiper><view class="btn btn2" @click="saveFun">保存到相册</view></view>
</template><script>export default {components: {},data() {return {list: ['https://cdn.uviewui.com/uview/swiper/swiper1.png','https://cdn.uviewui.com/uview/swiper/swiper2.png','https://cdn.uviewui.com/uview/swiper/swiper3.png',]}},onLoad(option) {},methods: {// 保存到相册 saveFun() {uni.showLoading({title: '图片下载中',mask: true})// 循环数组for (let i = 0; i < this.list.length; i++) {this.getTempPath(this.list[i],i)}},//此方法是单独下载每个图片,使用promise返回后通过 .then()方法继续下一个getTempPath(url,i) {let that = this;return new Promise((resolve, reject) => {wx.downloadFile({url: url,success: function(res) {var temp = res.tempFilePathwx.saveImageToPhotosAlbum({filePath: temp,success(res1) {resolve(res1)},fail: function(err) {reject(url + JSON.stringify(err))}})},fail: function(err) {reject(url + JSON.stringify(err))}})})},},}
</script><style lang='scss' scoped>.fixedbox{position: fixed;bottom: 0;right: 0;left: 0;background-color: #fff;}.tips {line-height: 34rpx;margin: 16rpx 24rpx 38rpx;}.btn {width: 376rpx;height: 98rpx;line-height: 98rpx;text-align: center;color: #FFF;}.btn1 {background: #F37043;}.btn2 {background: $uni-color-main;}
</style>
方法二,保存多张图片
saveFun() {let videolength = this.list.length; // 要下载的总条数uni.showLoading({title: '图片下载中',mask: true});let that = this;let index = 0;for (let i = 0; i < this.list.length; i++) {uni.downloadFile({url: that.list[i],success: function(res) {var temp = res.tempFilePathuni.saveImageToPhotosAlbum({filePath: temp,success(res1) {index++;// 全部下载完后触发if (index == videolength) {uni.hideLoading()that.successFun();}},})}})}
},
// 全部下载完后触发调用
successFun() {console.log('全部下载完后触发调用')
}
这篇关于【微信小程序】保存多张图片到本地相册 uni.saveVideoToPhotosAlbum保存视频 uni.saveImageToPhotosAlbum保存图片的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!