在 react-router 2.0.0 中使用自定义历史记录的问题

Question

具体来说，我想使用 "basename" 选项，这样我就可以运行我的应用程序在子目录中。

我有以下代码来设置历史记录。

var createHistory = require('history').createHistory;
var useRouterHistory = require('react-router').useRouterHistory;
var browserHistory = useRouterHistory(createHistory)({
    basename: "/subfolder"
});

然后我有以下路由配置

<Router history={browserHistory} className="react-container">
    <Route path="/" component={Template}>
        <IndexRoute component={Diary} />
        <Route path="diary(/:zoom)" component={Diary} />
        <Route path="login" component={Login} />
    </Route>
</Router>

我可以使用以下方法在组件本身中毫无问题地进行路由：

this.context.router.push('login');

但是当我尝试将新路由推送到 flux 存储中的历史记录时，它不起作用。它会将地址栏中的 URL 更改为正确的值，但组件不会更改。我可以刷新页面并按预期加载。

例如我可以使用：

//require browser history in store
var browserHistory = require('react-router').browserHistory;
....
//after login
browserHistory.push('/');

我希望加载 "Diary" 组件，但它会将 URL 更改为 /subfolder，并且该组件保留为登录页面。

如果我只使用

，路由都可以正常工作

require('react-router').browserHistory

而不是自定义代码，但我无法运行像我需要的那样将应用程序放在子目录中。

提前感谢您给我的任何帮助和提示。克里斯

Answer 1

在您的 Flux 存储中，您需要确保使用您为路由器设置的相同历史对象。

Answer 2

我现在遇到了与 react-router@2.8.1 完全相同的问题

地址栏中的 url 已正确更新，但 UI 上没有任何反应。如果我按 F5，它将起作用

仍在调查中....

在 react-router 2.0.0 中使用自定义历史记录的问题

Problems using a custom history in react-router 2.0.0

reactjs

react-router