当前位置: 首页 > news >正文

【微信小程序】保存多张图片到本地相册

在这里插入图片描述

<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})const imageList = []// 循环数组for (let i = 0; i < this.list.length; i++) {imageList.push(this.getTempPath(this.list[i],i))}// const loadTask = []// let index = 0;// while (index < imageList.length) {// 	loadTask.push(// 		new Promise((resolve, reject) => {// 			// 将数据分割成多个promise数组// 			Promise.all(imageList.slice(index, (index += 8)))// 				.then(res => {// 					resolve(res)// 				})// 				.catch(err => {// 					reject(err)// 				})// 		})// 	)// }},//此方法是单独下载每个图片,使用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) {if(i == that.list.length - 1){that.successFun();}return resolve(res1)},fail: function(err) {reject(url + JSON.stringify(err))}})},fail: function(err) {reject(url + JSON.stringify(err))}})})},// 全部下载完后触发successFun(){uni.hideLoading();this.$u.toast('保存成功,请去完成作业!');}},}
</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>
http://www.lryc.cn/news/106699.html

相关文章:

  • Python Numpy入门基础(二)数组操作
  • 【LeetCode每日一题】——1572.矩阵对角线元素的和
  • 牛客网Verilog刷题——VL55
  • python中数据可视化
  • DASCTF 2023 0X401七月暑期挑战赛web复现
  • go编译文件
  • Flowable-子流程-调用活动
  • java 并发
  • 【MySQL】DDL和DML
  • 使用python框架FastAPI
  • Vue实现leafletMap自定义绘制线段 并且删除指定的已绘制的点位
  • ChatGPT辅助写论文:提升效率与创造力的利器
  • 面试攻略,Java 基础面试 100 问(六)
  • 图解系列 DNS查找过程和DNS缓存
  • 《吐血整理》高级系列教程-吃透Fiddler抓包教程(21)-如何使用Fiddler生成Jmeter脚本-上篇
  • vim中出现复制不对齐-乱码问题
  • 华为OD机考真题--单词接龙--带答案
  • 排序进行曲-v3.0
  • 编辑列表操作时的一些思考,关于全量和增量操作
  • 【python】Python tkinter库实现重量单位转换器的GUI程序
  • CVPR2023新作:源数据集对迁移学习性能的影响以及相应的解决方案
  • 《TCP IP 网络编程》第十五章
  • 新特性解读 | MySQL 8.0 字段信息统计机制
  • 基于Java+Swing实现超级玛丽游戏
  • Day12-1-Webpack前端工程化开发
  • JUnit教程_编程入门自学教程_菜鸟教程-免费教程分享
  • Hive 安装介绍
  • npm ERR! code EPERM npm ERR! syscall unlink npm ERR!错误解决方法
  • redis 高级篇4 分布式锁
  • TPU-NNTC 编译部署LPRNet 车牌识别算法