微信小程序--多张图片下载问题--for循环出现漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）

微信小程序多图下载，之前肯定对单张图片下载了解了。这里就不再多说。

首先，多图下载肯定是用到循环了。那么问题就出在循环这里。在循环里调用单图下载方法。这样就会出现一个问题，就是下载时先遍历完了，然后再依次执行wx.downloadfile 获取到下载的临时文件路径，再使用wx.saveImageToAlbum这个API。如果调试过的话，你就发现这两个api是异步执行的，也就是各执行各的。这样就会出现问题。无法掌握下载的具体情况，是否完成，还是失败。

在下载前，小程序平台域名配置等工作要做好。还有就是要获取用户的下载权限。

那么如何解决这个问题呢？

那就是使用回调函数，这样就可以确保每次都执行正确后，再执行下一次循环。参考博客：微信小程序学习2.js基本使用之block回调函数使用

这就是要点。。。

2018-08-10 09 38 修改完善

看下我的代码吧。。记得借鉴就可以，一定不要粘贴。

//下载内容dow_temp: function (str, i, all_n,callback){var that = this;wx.authorize({scope: 'scope.writePhotosAlbum',success() {// 用户已经同意小程序使const downloadTask =wx.downloadFile({url: str,success: function (res) {var temp = res.tempFilePathwx.saveImageToPhotosAlbum({filePath: temp,success: function () {},fail:function(){wx.showToast({title: '第' + i +'下载失败',})}})},fail: function (res) {wx.showToast({title: '下载失败',})}})downloadTask.onProgressUpdate((res) => {if(res.progress == 100){callback(res.progress);var count = that.data.percent_n;//统计下载多少次了that.setData({percent_n:count+1})if (that.data.percent_n == all_n){//判断是否下载完成that.setData({//完成后，清空percent-N,防止多次下载后，出错percent_n: 0})that.dowNum();}}})},fail:function(){wx.showToast({title: '获取授权失败',})}})
},
download:function(){var that = this;var data = that.data.itemData.pic_essey;var dow_arr = that.data.dow_arr;wx.showLoading({title: '图片下载中..',})var all_n = data.length;for(let i=0,j=1;i<all_n;i++,j++){that.dow_temp(data[i],j,all_n,(text)=>{if(text == 100){wx.showLoading({title: j + '/'+ all_n + '下载中',duration:10000})if(j == all_n){wx.showToast({title: '下载完成',duration:1000})}}else{wx.showToast({title: '下载失败',})}console.log('拿到值了是'+text);})}
},

好了，如果电脑上测试的话，出现下载只能下载5张，，就改成远程手机测试。还有就是可能部分手机不能下载。那就是没有获取用户下载权限的原因了。。如果有其他的原因，请留言。

请多看看下面的代码：

for(let i=0,j=1;i<all_n;i++,j++){that.dow_temp(data[i],j,all_n,(text)=>{if(text == 100){wx.showLoading({title: j + '/'+ all_n + '下载中',duration:10000})if(j == all_n){wx.showToast({title: '下载完成',duration:1000})}}else{wx.showToast({title: '下载失败',})}console.log('拿到值了是'+text);})}

这里放上我小程序的源代码：欢迎提出修改意见。中玉玉器微商平台

就基于回调，在一次下载成功后，再执行下一次。

微信小程序--多张图片下载问题--for循环出现漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）相关推荐

微信小程序仿网易云音乐（使用云开发，提供源码）
微信小程序仿网易云音乐(使用云开发,提供源码)!!!!!!!!!!! 源码: 链接:https://pan.baidu.com/s/1z_ZnRVbT4vjEENimi8yBQQ 提取码:u0o3 一 ...
php 心愿墙系统源码,php开发表白墙 |源码|微信表白|微信表白墙|吐槽墙|心愿墙|网站留言板源码...
php开发表白墙 |源码|微信表白|微信表白墙|吐槽墙|心愿墙|网站留言板源码告白墙程序使用说明下载之后,文件目录如下: Forlove :程序核心文件夹: Public :样式图片 JS 文件夹 ...
ASP.NET开发实战精品源码及视频教程下载
ASP.NET开发实战精品源码及视频教程下载 2013-05-27 14:50:28 分类: Linux ASP.NET开发实战精品源码及视频教程下载 ASP 是一项微软公司的技术,是一种使嵌入网页 ...
【通知】▁▂▃ Himi 最新著作《iOS游戏编程之从零开始—Cocos2d-x与cocos2d引擎游戏开发》★书籍源码+第4/5/6样章★-免费下载★ ▃▂▁
2013年新年,Himi的第二本著作:<iOS游戏编程之从零开始-Cocos2d-x与cocos2d引擎游戏开发>一书正式发售: (大家可以到新华书店.淘宝.拍拍.当当.亚马逊等进行购买) ...
SSM同城拼车微信小程序的开发计算机毕设源码20625
摘要伴随着科技进步和经济全球化,人民生活水乎丕断提高,拥有私家车的人群也越来越庞大.据统计,我国汽车保有量持续高速度增长,众多的车辆上路,是造成交通拥堵的最主要原因.除此之外,随着经济高速发展,城市 ...
毕业季基于spring的基于安卓APP的基于ssm框架的基于微信小程序的管理系统设计与开发（开题+源码+讲解+论文）
毕业设计考察的是同学的专业知识的运用能力,除了对技能的考核,还看重你的创新思维,这里面设计到内容繁琐复杂. 对于还未毕业没有过项目开发经验的同学是有些难度的,一个程序的开发小到1两个月,大至几个月甚至 ...
PHP“动能”运动膳食微信小程序的开发计算机毕业设计源码504978
摘要近年来,随着移动互联网的快速发展,电子商务越来越受到网民们的欢迎,电子商务对国家经济的发展也起着越来越重要的作用.简单的流程.便捷可靠的支付方式.快捷畅通的物流快递.安全的信息保护都使得电子商 ...
跳转饿了么小程序、跳转美团小程序、获取小程序路径、小程序生成小程序码不能选择第三方小程序、领红包功能开发（附源码）
先上成果和功能我做的是随机推荐美食的小程序,食物数据是存库的而且后续会开放给用户新增食物的权限,然后有些小功能就是跳转到饿了么小程序和美团小程序领外卖红包,技术使用uniapp,开发工具是HBuil ...
Java开发陪玩系统源码小程序app详细介绍
Java开发的陪玩系统源码小程序app以下是它的功能介绍: 一.用户端: 1. 用户注册与登录:用户可以使用手机号或微信登录进行注册. 2. 服务列表:用户可以浏览选择陪玩师提供的服务类型和价格,包括 ...

微信小程序--多张图片下载问题--for循环出现漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）

微信小程序--多张图片下载问题--for循环出现漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）相关推荐

最新文章

热门文章

微信小程序--多张图片下载问题--for循环出现 漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）

微信小程序--多张图片下载问题--for循环出现 漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）相关推荐

最新文章

热门文章

微信小程序--多张图片下载问题--for循环出现漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）

微信小程序--多张图片下载问题--for循环出现漏下，乱序。最多下载5张图片的问题解决（附带个人开发小程序源码）相关推荐