react-router中的浏览器历史记录

Question

为什么在我的React应用程序中使用browserHistory ，它仍然在localhost：3000上提供一个页面，但是在部署它时，我得到的是一个空白页面，控制台中没有任何内容。

但是，当我切换到hashHistory时，它可以在localhost：3000和我的站点上正常运行。 为什么会这样呢？

部署（使用browserHistory）时，以下代码不起作用：

import React from 'react';
import { Router, Route, IndexRoute, browserHistory } from 'react-router';

import App from './components/App';
import Home from './components/Home';
import Company from './components/Company';

const router = (
    <MuiThemeProvider>
        <StyleRoot>
            <Router history={browserHistory}>
                <Route path="/" component={App}>
                    <IndexRoute component={Home} />
                    <Route path="/company" component={Company} />
                </Route>
            </Router>
        </StyleRoot>
    </MuiThemeProvider>
)

ReactDOM.render(
    router,
    document.getElementById('root')
);

我正在使用v3.0作为react-router。

Answer 1

首先，您使用的是哪个版本的React Router？ 在版本4中，您需要创建BrowserHistory的实例，而不仅仅是传递类。

您可能将空白页面作为路由错误的后备页面。 检查浏览器的控制台中是否有错误消息。 你应该得到一个缺省路由的http：//本地主机：3000 / BADURL ， <Home>为HTTP：//本地主机：3000和<App>与<Company>作为一个this.props.children 的http：//本地主机：3000 /公司 。

您可以使用<Route path="*" component={NotFoundPage} />将空白页面替换为404页面。

如果这些帮助都没有，请用更多信息更新问题。