反应将对象数组附加到表单数据答案

【问题标题】：React append array of objects to formdata反应将对象数组附加到表单数据
【发布时间】：2021-04-20 11:51:55
【问题描述】：

我在将对象数组（对象包含文件）附加到 formdata 时遇到问题。这是我需要发送到后端的表单数据。

{
  education: {
    name: "naziv edukacije ovde celavi",
    company: 1,
    app: 1,
    category: 1
  },
  slides: [
    {
       serial_num: 1,
       text: "test slajda",
       image: File
    },
    {
       serial_num: 2,
       text: "text slajda 2",
       image: File
    }
  ]
}

当我这样做时，它适用于教育对象

formData.append("education", education)

但幻灯片无法通过 console.log of slides array before appending to formData

我试过了

formData.append("slides", slides)

这给了我[object Object]，[object Object]

如果我尝试

formData.append("slides", JSON.stringify(slides))

对象的图像键丢失了大部分文件数据，使其不足以用于后端

【问题讨论】：

标签： reactjs multipartform-data form-data

【解决方案1】：

看起来你将不得不循环遍历你的数组，因为你将它附加到你的 formData，我从几个地方看到，here 和here。

但是对于您的示例，您可能可以执行以下操作：

const slides = [{serial_num: 1, text: "test slajda", image: File}, {serial_num: 2, text: "text slajda 2", image: File}]
const formData = new FormData();
slides.forEach(item => {
  formData.append(`slides`, JSON.stringify(item));
});
console.log(formData.getAll('slides'));

【讨论】：