uni-app 小程序多图上传:
官方提示说,App支持多文件上传,微信小程序只支持单文件上传,传多个文件需要反复调用本API。所以跨端的写法就是循环调用本API
步骤:
uni.chooseImage({
count: 9,
sizeType: ['original', 'compressed'],
sourceType: ['album'],
success: res => {
for (let i = 0; i < res.tempFilePaths.length; i++) {
this.uploadFiles.push(res.tempFilePaths[i]);
}
}
});
let arr = [];
for (let i = 0; i < this.uploadFiles.length; i++) {
let pro = uni.uploadFile({
url: '开发者服务器 url',
filePath: this.uploadFiles[i],
fileType: 'image',
name: 'file',
header: {
'Content-Type': 'multipart/form-data',
token: uni.getStorageSync('token')
}
});
arr.push(pro);
}
Promise.all(arr).then(result => {
let pic = '';
result.forEach(item => {
pic += JSON.parse(item[1].data).msg + ';';
});
console.log(pic)
})
DelImg(e) {
uni.showModal({
title: '提示',
content: '确定要删除这张照片吗?',
cancelText: '再想想',
confirmText: '再见',
success: res => {
if (res.confirm) {
this.uploadFiles.splice(e.currentTarget.dataset.index, 1);
}
}
});
}
ViewImage(e) {
uni.previewImage({
urls: this.uploadFiles,
current: e.currentTarget.dataset.url
});
},