uniapp批量上传图片

uniapp+uview 小程序批量上传图片笔记

<!--上传图片 u-upload-->
<u-upload :custom-btn="true" :fileList="fileList" :maxSize="3 * 1024 * 1024" :maxCount="6" multiple
				@on-list-change="onListChange($event)" @delete="deletePic" :auto-upload="false">
	<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
		<u-icon name="xiangji" custom-prefix="custom-icon" size="58" color="#ccc"></u-icon>
	</view>
</u-upload>

```javascript
<script>
	import {
		comments
	} from "@/api/index_hotel"
	export default {
		data() {
			return {
				start1: 4,
				start2: 4,
				start3: 4,
				start4: 4,
				content: '',
				orderId: '',
				hotelId: '',
				tempFilePaths: [],
				gettime: '',
				imgList: [],
				fileList: [],

			}
		},
		methods: {
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			onListChange(e) {
				let list = []
				if (e.length > 0) {
					e.forEach(item => {
						list.push(item.url)
					})
				}
				// console.log("list==>",list)
				this.tempFilePaths = list
			},
			//上传
			img_uploade(imgPaths, successUp, failUp, count, length) {
				let that = this
				let id = that.orderId
				let url = '' //此处由服务器提供API 
				uni.showLoading({
					title: '正在上传第' + count + '张',
				})
				uni.uploadFile({
					url: url,
					filePath: imgPaths[count - 1],
					name: "file",
					formData: {
						user: "test"
					},
					success: function(res) {
						successUp++
						let data = res.data
						data = JSON.parse(data)
						that.imgList = that.imgList.concat([data.data[0]])
					},
					fail: function(err) {
						uni.hideLoading()
						failUp++
						console.log(err)
					},
					complete: function(res) {
						count++
						if (count == length) {
							uni.hideLoading()
							uni.showToast({
								title: '上传成功',
								icon: 'success',
								duration: 2000
							})
							// console.log("imgList==>",that.imgList)
							that.comments(that.orderId, that.hotelId,that.imgList)
						} else {
							// 递归调用，上传下一张
							that.img_uploade(imgPaths, successUp, failUp, count, length)
						}
					}
				})
			},
			//评价
			getCurrentTime() {
				//获取当前时间并打印
				let that = this
				let yy = new Date().getFullYear()
				let aa = new Date().getMonth() + 1
				let mm = aa < 10 ? '0' + aa : aa
				let dd = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate()
				let hh = new Date().getHours() < 10 ? '0' + new Date().getHours() : new Date().getHours()
				let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
				let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
				that.gettime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss
			},
			comments(orderId, hotelId, list) {
				let that = this
				let users = uni.getStorageSync('loginUserInfo')
				that.getCurrentTime()
				let datas = {
					content: that.content, //内容
					images: list,
					evaluationTime: that.gettime,
					wechatUserId: users.id,
					hotelGroupId: users.hotel_group_id,
					hotelId: hotelId,
					orderId: orderId,
					healthScore: that.start1 + 1, //卫生
					environmentScore: that.start2 + 1, //环境
					serviceScore: that.start3 + 1, //服务
					facilityScore: that.start4 + 1, //设施
				}
				// console.log(datas)
				that.evaluation(datas)
			},
			async evaluation(datas) { //评价
				let that = this
				let url = await that.$http.config.baseUrl + `${comments}`
				uni.showLoading()
				uni.request({
					url: url,
					method: 'PUT',
					data: datas,
					success: res => {
						console.log("res==>", res)
						if (res.statusCode != 200) {
							uni.hideLoading()
							uni.showToast({
								title: '提交失败',
								icon: 'error'
							})
						} else {
							uni.hideLoading()
							uni.showToast({
								title: '提交成功',
							})
							setTimeout(function() {
								uni.navigateBack()
							}, 1000)
						}
					},
					fail: () => {},
					complete: () => {}
				})
			},
			bindTextAreaBlur(e) {
				this.content = e.detail.value
			},
			release() {
				let that = this
				let imgArr = this.tempFilePaths
				if (imgArr.length > 0) {//如果有选择图片就调用上传图片API
					let successUp = 0
					let failUp = 0
					let length = imgArr.length + 1
					let count = 1
					that.img_uploade(imgArr, successUp, failUp, count, length)
				}else{ //如果没有选择图片就调用评价API
					let list = []
					that.comments(that.orderId, that.hotelId,list)
				}
			}
		},
		onLoad(options) {
			if (options) {
				this.orderId = Number(options.orderId)
				this.hotelId = Number(options.hotelId)
			}
		}
	}
</script>