连接-反应-路由器做什么？

Question

我正在检查代码时，我在减速机上乱搞了一下。

import { combineReducers } from "redux"
import { connectRouter } from "connected-react-router"

const rootReducer = (history: any) =>
  combineReducers({
    router: connectRouter(history)
})


export default rootReducer

我不知道import { connectRouter } from "connected-react-router" (连接路由器)做什么。

我去了回购的npm页面，上面写着，

通过单向流(即历史->存储->路由器->组件)将路由器状态与redux存储同步。

但我无法理解上述说法。有谁能解释一下上面的声明是怎么说的？可能举个例子？

Answer 1

基本上，您可以使用connectedRouter在操作中分派导航操作(在我看来，这是最常见的用例)。例如，您可能希望在成功登录后导航到受保护的路由：

import { push } from 'connected-react-router'

export const login = (username, password) => (dispatch) => {

  /* do something before redirection */

  dispatch(push('/home'))
}

Answer 2

Redux解决了交叉多组分状态/数据共享问题。“连接-反应-路由器”基本上实现了在不同层上共享数据的一致性。第一层是一个“历史包”，它为在各种环境中管理JavaScript中的会话历史提供了几个不同的实现。你也有“存储”，主还原实体，作为第二层。路由器和组件是按升序排列的其余层。

资料来源：连接-反应-路由器文档 反应路由器历史