微信小程式多圖下載，之前肯定對單張圖片下載瞭解了。這裡就不再多說。

首先，多圖下載肯定是用到迴圈了。那麼問題就出在迴圈這裡。在迴圈裡呼叫單圖下載方法。這樣就會出現一個問題，就是下載時先遍歷完了，然後再依次執行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.tempFilePath
              wx.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);
    })
  }

這裡放上我小程式的原始碼：歡迎提出修改意見。中玉玉器微商平臺

就基於回撥，在一次下載成功後，再執行下一次。