uniapp 生成微信小程序 上传图片 上传顺序不按角标排列

uniapp 生成微信小程序 上传图片 上传顺序不按角标排列

 原因是在上传时图片大小上传的快慢不一样,导致小的图片传的快,就排在里最开始

 于是开始改写代码

先修改上传部分,每次上传都要等待结果,在上传下一个

async selectImage3(imgUrl){
				return new Promise((resolve, reject) => {
					var f=false;
					var url="";
					uni.uploadFile({
						url: VUE_APP_API_URL + "/fileUpload/upload",
						filePath: imgUrl,
						name: 'file',
						formData: {
							"type": "car"
						},
						success: (res) => {
							/* this.cartPhoto.push({
								'url': JSON.parse(res.data).data
							})
							uni.setStorageSync('cartPhoto', this.cartPhoto)
							console.log(this.cartPhoto) */
						    f=true;
							url = JSON.parse(res.data).data;
						},
						fail: (res) => {
							console.log(res)
						}
					});
					var timer = setInterval(() => {
					  if(f) {	// 只要len结束，将定时器清除
						  console.log("同步结束");
						  resolve(url)
						  if(timer != undefined){
							  clearInterval(timer)	// 上传操作完成，消除阻塞
						  }
					  }
					},1)
				},50);
			}

 调用

async  selectImage1(e) {
				console.log(e)
				for (var i = 0; i < e.tempFilePaths.length; i++) {
					var f=false;
					const imgUrl = e.tempFilePaths[i];
					var url= await  this.selectImage3(imgUrl);
					console.log(url)
					this.cartPhoto.push({'url': url});
					uni.setStorageSync('cartPhoto', this.cartPhoto);
				}

			},