axios请求中将多个文件作为对象提交答案

【问题标题】：Submit multiple files in axios request as an objectaxios请求中将多个文件作为对象提交
【发布时间】：2021-07-02 15:38:35
【问题描述】：

我必须以某种格式发送多个图像作为 API 调用的一部分

{
"date":"currentDate",
"files":[Files uploaded via input box]
}

我也使用了以下方法

方法 1

const event = document.querySelector("#files");
const filesData = new FormData();
filesData.append(`files`, event.files);
filesData.append("date", "2021-04-07");

浏览器中的表单数据来了：

文件：[对象文件列表] 日期：2021-04-07

方法二

const filesData = new FormData();
 for (let i = 0; i < event.files.length; i++) {
    filesData.append(`file${i}`, event.files[i]);
    }

formData.append("date", "2021-04-07");

浏览器中的表单数据来了：

file0: (二进制) 文件1：（二进制）文件2：（二进制）文件 3：（二进制）日期：2021-04-07

方法 3

const filesData = new FormData();     
filesData.append(`files`, Object.values(event.files));
formData.append("date", "2021-04-07");

浏览器中的表单数据来了：

文件：[对象文件]、[对象文件]、[对象文件]、[对象文件] 日期：2021-04-07

在 POSTMAN 中相对容易。

由于 API 失败，有人可以指导实现相同目标的正确方法

【问题讨论】：

标签： javascript jquery reactjs file-upload axios

【解决方案1】：

在我研究和寻找解决方案的过程中，我了解到 Postman 中有一个有趣的功能，可以看到 axios 调用的代码片段。

在Postman的右上角，有

> v8+ 中的符号
除了 Cookies 代码之前的版本

这会打开 Code sn-p，您可以在其中看到与不同语言的 axios 请求对应的 code sn-p。

解决方案：

const event = document.querySelector("#files");
const filesData = new FormData();
for (let i = 0; i < event.files.length; i++) {
  filesData.append(`images`, event.files[i]);
}
filesData.append("date", "2021-04-07");

希望这可以帮助许多像我一样的人。

【讨论】：