uniapp 微信小程序 实现上传多个图片

效果图：

代码：

upload.vue

config/request.js

function uploadFile_common (url, file, name, callback = '') {
	const token = uni.getStorageSync('user_token')
	return new Promise((resolve, reject) => {
		console.log('拿到的参数：', url, file, name)
        uni.uploadFile({
			url: baseUrl + url,
            header: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'multipart/form-data' },
			fileType:'image',
            filePath: file.uri,
            name: name,
            success: res => {

            },
            fail: err => {
                reject(err)
                console.log('[上传接口错误:uploadFile_common:',err)
            },
            complete: res => {
                if (callback){
                	return callback(res.data)
                }
                if (res.data.code === 401) {
                    console.log('上传接口401:uploadFile_common')
					try {
						uni.removeStorageSync('user_token')
					} catch (e) {
						console.log('user_token移除失败(uploadFile_common)')
					}
					// 将需要重新执行的接口缓存到一个队列中
					addSubscriber(() => {
						uploadFile_common(url, file, name, formData, resolve)
					})
					if (isRefreshing) {
						getNewToken().then(() => {
							// 依次去执行缓存的接口
							onAccessTokenFetched();
							isRefreshing = true;
						}).catch(e => {
							console.log('getNewToken错误(uploadFile_common):', e)
						})
                   }
                   isRefreshing = false; 
                } else {
                    resolve(res.data)
                }
            }
        })
	})
}
export { uploadFile_common }

refund.js

import {uploadFile_common} from '@/config/request.js'
export default {
	// 上传申请照片
	uploadRefundAnnexFile(file, name) {
		return uploadFile_common('/wechat/selfPrint/refundApply/uploadRefundApplyAnnexFile', file, name)
	},

}