如何在 React JS 中发送表单数据中的对象数组？

Question

我一直在尝试在后端使用 React JS 发送表单数据中的对象数组。当我使用其 append 方法将数据推送到表单数据中时，它将我的数组显示为 this

SurveyAnswers: [object object, object, object]

在浏览器的网络选项卡中，但我们一直在后端收到空值。我们已经检查了后端 API 当我们使用邮递员发送数据时它工作正常，但是，当通过前端发送数据时，它有问题。以下是我的代码片段：

const answers = [ 
  {
    Answer: "Hello World",
    QuestionId: 26,
    UserId: 190
  },
  {
    Answer: "Document",
    File: file,
    UserId: 190,
    QuestionId: 23
  }
]

const onSubmit = () => {
  const data = new FormData();
  data.append("SurveyAnswers", answers);
  const res = await executeAddSurveyFormAnswers({ data: data });     
  console.log('response, res);
}

Answer 1

如果您尝试传递一个对象，您将需要对该对象进行“字符串化”

data.append("SurveyAnswers", JSON.stringify(answers))

然后在后端，您需要“解析”或“反序列化”字符串以将其转换回对象。我不知道你在服务器端使用什么语言，但你可以搜索“parse json string in XXX”<-XXX is the language (ie.. C#)

Answer 2

Then on the backend, you will need to "Parse" or "Deserialize" the string to convert back to an object.

如果您使用 Node.js，您将使用 JSON.parse() 将字符串化对象反序列化为原生 javascript 对象。

如何在 React JS 中发送表单数据中的对象数组？

How to send an array of objects inside form data in React JS?

javascript

form-data

reactjs