这是调用uploadImage的代码: uploadDeficiencyImage: function (e) { var deficNumber = e.currentTarget.dataset.id var StationName = this.data.StationName if (StationName.replace(/(^s*)|(s*$)/g, "").length == 0) { wx.showToast({ title: '请输输入名字', icon: 'error', duration: 900 }) } else { wx.chooseMedia({ count: 3, mediaType: ['image'], sizeType: ['compress'], success: res => { var count = res.tempFiles.length var isLastOne = false var deficCount = this.data.deficList[deficNumber]["缺陷照片"].length for (var i = 0; i < count; i++) { var filePath = res.tempFiles[i].tempFilePath if (i == count - 1) { isLastOne = true } if (this.checkImageType(filePath)) { this.uploadImage(filePath, "缺陷照片/" + this.data.StationName + "_缺陷" + (deficNumber + 1) + "." + (++deficCount) + "_" + Date.now() + this.getImageType(filePath), deficNumber, isLastOne) } else { wx.showToast({ title: '非png,jpg,jpeg格式', icon: 'error', duration: 1800 }) } } } }) } },
为什么往页面加新图片时偶尔会有几张显示不出来?图用list存的,有使用setData在后台有一个list存所有图片。当用户上传多张照片时理应全都显示在页面上,但偶尔会有只显示一两张的情况。如果用户在其他地方上传一张照片,少显示的图就都能正常显示了(其他地方也调用的这个uploadImage) uploadImage是循环调用的,但只有最后一次循环会用setData修改页面,以下是代码 uploadImage: function (filePath, cloudPath, deficNumber, isLastOne) { wx.showLoading({ title: '图片上传中', }) wx.cloud.uploadFile({ cloudPath: cloudPath, filePath: filePath }).then(res => { var deficList = this.data.deficList deficList[deficNumber]["缺陷照片"].push(res.fileID) if (isLastOne) { this.setData({ deficList: deficList, hideDeficImg: false }) wx.hideLoading() wx.showToast({ title: '图片已上传', icon: 'success', duration: 900 }) } }, <view wx:for="{{deficList[index]['缺陷照片']}}" wx:for-item="element" wx:key="index" class="imageContainer"> <image src="{{element}}" class="image" hidden="{{hideDeficImg}}"></image> </view>
01-19