React-Router - 未捕获的TypeError错误:无法读取未定义的'getCurrentLocation'属性

51

我正在使用最新版本的react-router (版本 ^3.0.0)。

我用ES5编写了以下路由代码:

routes.js:

var React = require("react");
var Router = require("react-router");
var AuthorPage = require('./components/authors/authorPage')
var App = require('./components/app')
var Route = Router.Route;

var routes = (
    <Route path="/" component={App}>
        <Route path="authors" component={AuthorPage}/>
     </Route>
);

module.exports = routes;

在另一个名为main.js的JS文件中,我执行了以下调用:

main.js

var React= require("react");
var ReactDom = require("react-dom");
var Router = require('react-router').Router;
var routes = require('./routes');
ReactDom.render(<Router routes={routes}></Router>, document.getElementById('app'));

当我运行代码时,我在Google Chrome开发者工具中得到以下异常:
Uncaught TypeError: Cannot read property 'getCurrentLocation' of undefined
这是为什么?我缺少了什么?
2个回答

58

你没有将历史记录传递给你的<Router>

查看histories文档了解更多信息。


10

我遇到了同样的错误,解决方法如下:

添加

var hashHistory = ReactRouter.hashHistory;

在路由器中将history设置为hashHistory

<Router history={hashHistory}>

所以在你的情况下:

var routes = (
<Router history={hashHistory}>
    <Route path="/" component={App}>
        <Route path="authors" component={AuthorPage}/>
     </Route>
</Router>
);

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接