您的位置:首页 > 移动开发

uniapp中上传多张图片(或文件)

2020-08-23 17:19 543 查看

在微信小程序中不支持多张图片上传,需要做循环实现多张图片上传

// 官方这边是只能一次上传一张
uni.chooseImage({
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
uni.uploadFile({
url: 'https://www.example.com/upload', //仅为示例,非真实的接口地址
filePath: tempFilePaths[0],
name: 'file',
formData: {
'user': 'test'
},
success: (uploadFileRes) => {
console.log(uploadFileRes.data);
}
});
}
});

上传多张(做循环)

uni.chooseImage({
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
for(let i = 0;i < tempFilePaths.length; i++) {
uni.uploadFile({
url: 'https://www.example.com/upload', //仅为示例,非真实的接口地址
filePath: tempFilePaths[i],
name: 'file',
formData: {
'user': 'test'
},
success: (uploadFileRes) => {
console.log(uploadFileRes.data);
}
});
}
}
});

如果是app或者h5端,可以设置files实现多张图片上传

uni.chooseImage({
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
let imgs = tempFilePaths.map((value, index) => {
return {
name: index,
uri: value
})
uni.uploadFile({
url: 'https://www.example.com/upload', //仅为示例,非真实的接口地址
files: imgs,
success: (uploadFileRes) => {
console.log(uploadFileRes.data);
}
});
}
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: