【发布时间】:2017-12-08 10:47:40
【问题描述】:
我有一个动态路由器,它将路由作为<App> 的道具。默认所有路由都被屏蔽,用户只能去Payments。
我有几个层次<Payments>。完成首次付款后,您应该能够访问整个应用程序,简而言之:
<App> -> <OtherComponent> -> <OtherComponent> - <Payments>
我想在<Payments>(孙子)中调度一个动作,它将改变<App>减速器中的redux状态并更改<App>道具(祖父),我该如何处理?就我而言,我只能在<Payments> 中映射StateToProps,但路由器在<App> 中。
我正在使用基本的 react-router,并且不想将其更改为其他任何东西(例如 react-redux-router)。
【问题讨论】:
-
所有组件都可以访问整个应用程序状态,您可以从任何地方发送一个动作来更新状态,相关组件将获取它,这就是使用 redux 存储而不是组件状态的美妙之处
-
您可以连接驻留在 redux
<Provider>组件内的每个组件,因此也可以将状态映射到每个组件的 props。这实际上是你使用 redux 的原因。因此,只需在您的<Payments>component 中发送一个更改状态的操作并将您的<App>component 连接到它。 -
Redux 的状态可以被认为是应用程序范围的,因为任何(连接的)组件都可以调度操作并访问应用程序级别的状态,因此您只需定义正确的对象和相关的Redux 中的操作,然后在组件级别正确使用这些对象 - 组件的层次结构并不真正相关(除了 props 的传递,但这是相当标准的)。
-
您不会在组件之间传递道具。相反,您使组件调度一个更改全局状态的操作,并将每个组件连接到需要从商店获取更新的商店。 redux 文档有很多例子。
-
另外,如果你认为 reducer 属于某些组件,你还没有正确理解 redux 的概念。您存储的是一个可以保存任意数据并通过将组件连接到它来使其全局可访问的对象。 reducer 不属于某个组件,但负责更新 store 中的嵌套对象。它与组件无关。基本上你甚至可以在没有反应的情况下使用 redux。
标签: reactjs redux react-router