Reactjs 如何触发深度嵌套子组件的刷新

我有一个深度嵌套的组件层次结构（假设5个组件相互包含），现在我可以在其中一个嵌套（子）组件中执行一些后端请求。在此之后，我想刷新父级上的数据，以便所有内容都显示新数据。 对于我用来传递刷新方法的一个层次结构步骤，可以从子级调用该方法。 但对于更深层的嵌套，这似乎是容易出错的，而且不是正确的方法。 有没有关于如何正确处理这个问题的提示？

---

我在某个地方读到过我可以使用上下文api的文章，但这对我来说似乎不是正确的方法，但我可能在这里弄错了，有什么想法吗？

你必须这样想：在react中，你不想“触发刷新”，这是react的工作。 您希望告诉react这段UI依赖于这段数据，并让它担心渲染

您可以通过拥有关于数据的单一真实来源来实现这一点（上下文、redux、useReducer hook是三个有趣的选项）。然后，您需要订阅组件内的数据更新，不管它们嵌套得有多深（通常通过挂钩）

编辑

是的，我不太明白你的问题！下面是另一种尝试：-）

因此，基本上，您可以使用useState钩子将您的状态存储在父组件中，通过道具将该状态传递给子组件，并使其中一个嵌套子组件执行对后端的调用

当您只有一个或两个层次结构时，通过传递一个函数来更新该状态可以很好地工作，但是您已经注意到，当您有深度嵌套的子级时，这种方式无法扩展

在我看来，你的数据需要一个单一的真实来源。通过props传递状态不是一个好的解决方案，因为嵌套组件没有实际更新数据的方法

你应该调查一下Redux。您的用例实际上是我第一次使用它的原因（我很确定大多数人也是如此）

您的所有状态都位于一个对象中，您可以从层次结构中的任何组件访问该对象，其美妙之处在于任何组件都可以发送更新

当然，如果从任何组件更新状态对象（存储），则使用该数据的任何其他组件都会得到更新

看看是谁教你如何重新思考

---

另外，它是一个库，允许您在编写更少代码的同时使用redux。

上下文Api确实是实现这一点的方法，您可以尝试的另一个仍然非常流行的方法是redux-我知道redux，我没有使用它的原因是，因为这样我就需要在子组件中加载可能重复的数据。你知道如何使用上下文api进行类似的smth吗？我想你可能误解了我的问题。我想在后端触发数据的重新加载。我正在使用useState钩子，用于运行良好的本地数据存储。但是，例如，我让一个父组件加载用户数据。子组件在后端对其进行变异，但是父组件需要重新加载该数据，以便在工具栏中以正确的方式显示数据。是的，我不明白！我编辑了我的答案。