[React]什么是 "best React practice" 来处理不同组件之间的事件

[React]what is the "best React practice" to handle events in-between different components

所以...我有一个简单的应用程序可以做笔记。像 MacOS 备忘录应用程序。 我有“添加卡”按钮和“备忘录”列表。 我可以滑动备忘录以显示卡片选项,如删除、存档等。

每当我点击“添加卡片”时,我想要重置备忘录的所有状态。(例如将打开状态滑动回 false)。

但问题是“添加卡”和每张备忘录卡都是不同的组件,彼此无法访问。我应该如何让备忘录组件知道“添加卡片”按钮已被单击?

我是 React 的新手,我几乎觉得 React 不是为这样的动作而构建的。

这里有两个主要选项,useContextredux。如果您没有任何复杂的逻辑并且不需要在整个应用程序中共享的全局状态,请使用 useContext,否则您应该使用更复杂的 redux实施。

useContext 的主要目标是避免 prop drilling,即在许多组件之间传递 props 的情况。因此,您包装了所有应该使用上下文提供程序访问状态的组件,并且可以从提供程序包装的任何组件获取此状态,请read the docs了解有关 useContext 的更多信息。

另一个选择是 redux,它要复杂得多,你可能需要至少一周的时间来理解和应用这些概念,所以我建议当你的应用程序具有真正需要的复杂状态逻辑时才使用 redux更好的全局状态管理。不管怎样,知识总是受欢迎的,所以read the redux docs and also watch this video about redux.