时间戳

首页 > 解决方案 > 在 React 子组件中触发多个 POST 请求

reactjs - 在 React 子组件中触发多个 POST 请求

问题描述

我正在开发一个React应用程序，该应用程序允许用户设置一些要在某个后端创建的用户对象。用户设置好要创建的用户后，会显示一个摘要页面，在表格中显示即将创建的用户。

因此，当用户单击“导出”按钮时，我想为表中列出的每个用户向后端发送一个 POST 请求。每个表行应显示其相应 POST 请求的当前状态。所以我的想法是为表行创建一个Component，让每一行分别处理它的 POST 请求和响应。

我的问题是，我如何告诉子组件发送请求？触发所有请求的按钮位于父组件中。

据我了解，React父组件中不应调用子组件中的操作。似乎有一种方法可以通过使用React.forwardRefandReact.useImperativeHandle或类似的东西来做到这一点，但我这似乎有点复杂，让我想知道我是否在我的用例的正确轨道上。

我想出的唯一其他想法是使用useEffect和这样的道具sendTriggered：

React.useEffect(() => {
  if (sendTriggered) {
   sendPostRequest();
  }
}, [sendTriggered]);

然后，父组件将设置sendTriggered为true单击按钮时。但这似乎也是在滥用东西^^

当然，我也可以处理父组件中的所有请求和响应，并且只通过 传递状态Props，但我认为每个组件都应该对自己的请求负责。

任何人都可以提出更好的方法吗？我认为这是一个相当常见的用例。

标签： reactjstypescriptreact-hooks

解决方案

推荐阅读