为什么我做的提交图片一直是提交中?
//uploadPilot.js 自营点上传图书
//获取应用实例
var app = getApp()
const db = wx.cloud.database()
Page({
data: {
bookInfo:null,
hidden:1,
tempImg: [],
fileIDs: [],
},
submit: function () {
wx.showLoading({
title: '提交中',
})
const promiseArr = []
//只能一张张上传 遍历临时的图片数组
for (let i = 0; i < this.data.tempImg.length;i++) {
let filePath = this.data.tempImg[i]
let suffix = /\.[^\.]+$/.exec(filePath)[0]; // 正则表达式,获取文件扩展名
//在每次上传的时候,就往promiseArr里存一个promise,只有当所有的都返回结果时,才可以继续往下执行
promiseArr.push(new Promise((reslove,reject)=>{
wx.cloud.uploadFile({
cloudPath: new Date().getTime() + suffix,
filePath: filePath, // 文件路径
}).then(res => {
// get resource ID
console.log(res.fileID)
this.setData({
fileIDs: this.data.fileIDs.concat(res.fileID)
})
reslove()
}).catch(error => {
console.log(error)
})
}))
}
Promise.all(promiseArr).then(res=>{
db.collection('comments').add({
data: {
fileIDs: this.data.fileIDs //只有当所有的图片都上传完毕后,这个值才能被设置,但是上传文件是一个异步的操作,你不知道他们什么时候把fileid返回,所以就得用promise.all
}
})
.then(res => {
console.log(res)
wx.hideLoading()
wx.showToast({
title: '提交成功',
})
})
.catch(error => {
console.log(error)
})
})
},
uploadImgHandle: function () {
wx.chooseImage({
count: 9,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success:res=> {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths
this.setData({
tempImg: tempFilePaths
})
}
})
},
//事件处理函数
onLoad: function (options) {
},
onReady: function () {
},
})
<button type="warning" bindtap='uploadImgHandle'>上传图片</button>
<view>
<block wx:for="{{tempImg}}" wx:key="{{index}}tmpimg">
<image src='{{item}}' mode='aspectFill'></image>
</block>
</view>
<button type="primary" bindtap='submit'>提交</button>
报错代码是 reslove()
}).catch(error => {
console.log(error)