我是靠谱客的博主 鲜艳大雁,最近开发中收集的这篇文章主要介绍 小程序保存多张图片,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

前言

使用promise 队列,保存多张图片到手机相册
问题:有些手机会出现只能保存五张图片,报错信息:无法写入
promise需要好好学习

核心代码

// pages/saveImgs/index.js
import { writePhotosAlbum } from '../../utils/util'
Page({
  /**
   * 页面的初始数据
   */
  data: {
    list: [
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160008479.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160013201.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160015969.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160025498.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160031519.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160042689.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160108243.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160111756.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190304160141454.jpg'
    ],
    loading:false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {},
  // 下载图片
  downloadImgs() {
    var _this = this
    // 获取保存到相册权限
    writePhotosAlbum(
      function success() {
        wx.showLoading({
          title: '加载中',
          mask: true
        })
        // 调用保存图片promise队列
        _this
          .queue(_this.data.list)
          .then(res => {
            wx.hideLoading()
            wx.showToast({
              title: '下载完成'
            })
          })
          .catch(err => {
            wx.hideLoading()
            console.log(err)
          })
      },
      function fail() {
        wx.showToast({
          title: '您拒绝了保存到相册'
        })
      }
    )
  },
  // 队列
  queue(urls) {
    let promise = Promise.resolve()
    urls.forEach((url, index) => {
      promise = promise.then(() => {
        return this.download(url)
      })
    })
    return promise
  },
  // 下载
  download(url) {
    return new Promise((resolve, reject) => {
      wx.downloadFile({
        url: url,
        success: function(res) {
          var temp = res.tempFilePath
          wx.saveImageToPhotosAlbum({
            filePath: temp,
            success: function(res) {
              resolve(res)
            },
            fail: function(err) {
              reject(res)
            }
          })
        },
        fail: function(err) {
          reject(err)
        }
      })
    })
  }
})

clipboard.png

项目案例

github地址

git clone https://github.com/sunnie1992/soul-weapp.git

直接用微信小程序开发工具打开就可以看到案例了

如果对你有帮助送我一颗小星星(づ ̄3 ̄)づ╭❤~

最后

以上就是鲜艳大雁为你收集整理的 小程序保存多张图片的全部内容,希望文章能够帮你解决 小程序保存多张图片所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(46)

评论列表共有 0 条评论

立即
投稿
返回
顶部