我们之前已将所有路由参数添加到 react-router 的 redux-store 运行 v2 中。这在我们的应用程序中引用,并且更改它的使用包含大部分风险。我们的目标是升级到 v4,我正在寻找一种方法将 params 同步到商店。

以前,我们使用 react-router 来自 react-router 来执行此操作,只需点击位置更改时调度的 react-redux-router 操作。从我在 react-router docs 中可以看到的,仍然有一个函数可以做 path-matching。

给定路由如:

<Route path="/foo/:id/:id2" render={() => <div />} />

我在 reducer 中试过这样的东西:

import {matchPath} from 'react-router';

const initialState = {};

export default function(state = initialState, action){
  switch(action.type){
    case "@@router/LOCATION_CHANGE": {
      const {pathname} = action.payload.location;
      return {...state, params: matchPath(pathname).params}
    }
    case default: return state;
  }
}

这根本不起作用,因为似乎 matchPath 函数实际上并没有通过所有已注册的路径运行,它只是匹配你放入的任何路由,以及你作为第二个参数放入的其他路由。所以前:

const pathname = '/foo/1/2';
const findRoute = matchPath(pathname, {exact: true, path: '/foo/:id/:id2'});
//would return {..., params: {id: 1, id2: 2}};

这对我没有帮助,因为我不知道它首先与哪条路线相匹配,只知道我目前在哪个位置。还有其他人为此找到了一个好的解决方案吗?有没有办法让所有路线在 react-redux v4 中注册,然后我可以遍历它们以找到匹配。