在初始渲染时,ConnectedRouter重定向到页面上重新加载时的“ /”

时间:2019-06-06 13:18:38

标签: reactjs redux connected-react-router

我有一个带有React-Router和connected-react-router的React-Redux应用程序(以便能够在redux操作中更改位置):

const main = () => {
  hydrate(
    <AppContainer warnings={false}>
      <Provider store={store}>
        <ConnectedRouter history={history}>
          <Switch>
            {renderRoutes(routes)}
          </Switch>
        </ConnectedRouter>
      </Provider>
    </AppContainer>,
    mountApp
  );
};

要在redux操作中更改位置,请执行以下操作:

import { push } from 'connected-react-router';
...
export const gotoProjects = () => {
  return async dispatch => {
    dispatch(push('/projects'));
  };
};

这很好,但是我遇到了我不了解的行为:

当我通过redux动作触发位置时,一切正常。 但是,当我使用网址/projects重新加载页面(=浏览器刷新)时,就会向@@router/LOCATION_CHANGE派发一个/动作。

此位置更改仅在production模式下发生。 在development模式下(与react-hot-loader一起使用),URL已正确加载。

如果我将ConnectedRouter中的BrowserRouter替换为react-router-dom,则在productiondevelopment模式下一切正常。

在路线的初始呈现中,历史记录对象如下所示(预期):

{
  "history": {
    "length": 6,
    "action": "POP",
    "location": {
      "pathname": "/projects",
      "search": "",
      "hash": ""
    }
  }
}

但是以某种方式ConnectedRouter进行重定向。

最欢迎任何帮助!


编辑:这是路线代码:

const routes = [
  {
    path: '/',
    exact: true,
    component: Home,
  },
  {
    path: '/projects',
    exact: true,
    component: Projects,
  },

  ...
];

0 个答案:

没有答案