Guide-2019-05-13-React Router 4.x官方文档翻译-Redux集成

Redux是React生态系统很重要的一部分。我们希望将React Router和Redux的集成尽可能无缝地集成到想要同时使用它们的人们身上。

阻塞更新

通常，React Router和Redux可以很好地协同工作。有时，当导航改变时，应用程序的某个组件（子路由或者选中的某个导航链接）不会更新。
包含以下情况：

• 1、组件通过connect()方法连接到redux
• 2、组件是“非路由组件”，也就是不是通过这种方式渲染的。
  问题是Redux实现了shouldComponentUpdate，如果它没有从路由器接收属性，则没有任何迹象表明该组件发生了任何变化。这很容易解决。找到连接组件的位置并将其包装在withRouter中。

// before
export default connect(mapStateToProps)(Something)

// after
import { withRouter } from 'react-router-dom'
export default withRouter(connect(mapStateToProps)(Something))

深度合成

有些人想：

• 从store中获取并同步数据
• 通过派发actions进行导航
• 支持Redux devtools中路由更改的时间旅行调试。

所有的这些需要更深入的整合

我们建议您不要将您的路由保存在Redux的store中。理由如下；

• 路由数据已经成为大多数组件的核心。无论是来自store还是router，您的组件代码都大致相同。
• 大多数情况下，你可以使用、、进行导航。有时您可能还需要在初始化的某个异步任务之后以编程方式导航。比如，当用户提交一个登录表单之后派发一个action。你的trunk, saga以及其他一步任务需要验证凭据，如果验证成功，它需要以某种跳转方式跳转到一个新的页面。直接的解决办法是在payload中包含history对象（所有组件都包含这个对象），然后你的异步任务中就可以以某种合适的方式使用该对象进行导航了
• 路由的变化对于时间旅行调试不是很重要。唯一明显的例子是调试路由器/存储同步的问题，如果你根本不同步，那么就不会存在这个问题。

但你如果强烈要同步store和router，可以试试connected React Router,第三方绑定React Router v4和Redux。