Redux 从当前页面向上传递/刷新状态

Question

我有一个 react 应用程序（repo），我想使用 redux 来普遍存储状态，以便根应用程序可以访问它。

例如：一个页面具有填充该页面的 GET API 调用。这一切正常，但我对如何做几件事感到困惑。

1. 如何在 redux 操作中使用变量，让操作说出模型的 ID 并让它返回模型（API 返回 json）。
2. 然后我如何传递该状态，以便更高阶的组件（例如基础 App.js）可以访问该状态，以便我可以在导航中使用当前页面中的变量。
3. 什么/何时是更新 redux 状态的最佳方式/时间，以便使用 redux 状态在任何地方反映更改？

具体来说（在这个项目中）：如果您localhost/spells/X使用 X 作为模型 ID，我如何将状态从该页面的容器组件（在本例中为 LayoutSpellView）传递到 MaterialUIApp

index.js
  |--App.js
     |--MaterialUiApp
        |--Router
           |--LayoutSpellView (pass state up to MaterialUiApp)

Answer 1

使用 Redux，您不会向上或向下传递状态。你用你的动作创建者和减速器更新全局状态。无论您在哪里需要达到状态，您都可以将组件连接到状态并使用它。你有一个商店，它包含一个全局状态。该全局状态可能包含多个不同的状态。

1. 您可以在动作创建者中使用有效载荷或任何其他名称、变量。在您的减速器中，您可以获得带有 action.payload、action.id 等的那些。

2. 正如我在第一段中所解释的，您可以在需要时更新状态。之后，您可以在任何需要的地方将任何组件连接到您的状态。

3. 没有最好的时间或最好的方法来做到这一点。这取决于您的代码和应用程​​序逻辑。

当然，有一些最佳实践，但我们不能谈论得如此广泛。在你接触到 Redux 之后，你会看到其中的一些。例如，我说“我们不会通过 Redux 向上或向下传递状态”。这是真的，但有时为了避免connect在组件周围有这么多的s，我们使用容器应用程序，将该应用程序连接到存储（实际上是通过存储到达状态），然后将相关的状态部分传递给相关的组件。

我推荐 Redux 自己的文档作为起点：https : //redux.js.org/