如何使用 FormData() 从 React Js 向 Nodejs、MongoDB 发送对象数组？答案

【问题标题】：How To Send Array of Object using FormData() From React Js To Nodejs, MongoDB?如何使用 FormData() 从 React Js 向 Nodejs、MongoDB 发送对象数组？
【发布时间】：2021-03-18 11:10:38
【问题描述】：

状态就像

state = {
courseTitle: "",
courseImage: "",
duration: "",
overView: "",
syllabus: [
  {
    title: "",
    description: "",
  },
 ],
};

我正在使用 FormData() 提交数据，因为我也有图像

handleSubmit = (e) => {
e.preventDefault();
const fd = new FormData();
fd.append("courseTitle", this.state.courseTitle);
fd.append("courseImage", this.state.courseImage);
fd.append("duration", this.state.duration);
fd.append("overView", this.state.overView);
fd.append("syllabus", this.state.syllabus);

this.props.addCourse(fd);
};

除了教学大纲，一切都很好，因为它在数组中，FormData 发送一个教学大纲的值，

syllabus:[object object]

请任何人帮助我如何发送具有上述状态格式的数组数据，我正在为后端 nodejs、express 和 mongodb 使用 react 和 redux

【问题讨论】：

标签： javascript node.js reactjs mongodb

【解决方案1】：

一种方法是发送通过JSON.stringify 传递的值（并适当地更改服务器代码或使用 api 文档检查有效的请求规范）。在您的示例中，将syllabus 附加为fd.append("syllabus", JSON.stringify(this.state.syllabus))。

【讨论】：

【解决方案2】：

我知道的最简单的方法是对数组进行字符串化并追加。然后在后端解析。

// On frontend
fd.append("syllabus", JSON.stringify(this.state.syllabus));

// On backend
JSON.parse(syllabus)

【讨论】：