帮我写一个uniapp 多图片上传的代码
时间: 2023-12-25 08:06:20 浏览: 92
好的,下面是一段uniapp多图片上传的代码,可以参考一下:
```js
// 获取上传图片的数据
async function getUploadImageData(chooseFiles) {
let imgData = []
for (let i = 0; i < chooseFiles.length; i++) {
let tempFilePath = chooseFiles[i].path
let uploadRes = await uni.uploadFile({
url: '上传图片的链接',
filePath: tempFilePath,
name: 'file',
header: {
'Content-Type': 'multipart/form-data'
},
formData: {
// 可以向服务器传递参数
}
})
if (uploadRes.statusCode === 200) {
let data = JSON.parse(uploadRes.data)
if (data.code === 0) {
imgData.push(data.data.url)
}
}
}
return imgData
}
// 多图片上传
async function uploadMultiImages() {
let chooseFilesRes = await uni.chooseImage({
count: 9, // 最多可以选择的图片数量
sizeType: ['compressed'], // 压缩图
sourceType: ['album', 'camera'], // 从相册和相机中选择
success: function (res) {
return res
},
fail: function (error) {
console.error(error)
}
})
if (chooseFilesRes.errMsg === 'chooseImage:ok') {
let imgData = await getUploadImageData(chooseFilesRes.tempFiles)
console.log('上传成功的图片:', imgData)
}
}
```
以上代码是一个多图片上传的流程,先让用户选择图片,然后再通过异步上传到服务器,上传的过程中可以向服务器传递参数,最终将上传成功的图片显示出来。需要注意的是,上传图片的链接需要自己替换为真实的上传链接。
阅读全文
相关推荐
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![pdf](https://img-home.csdnimg.cn/images/20241231044930.png)