React-Router - 未捕获的类型错误：无法读取未定义的属性“getCurrentLocation”

Posted 2023-02-21

【中文标题】React-Router - 未捕获的类型错误：无法读取未定义的属性“getCurrentLocation”

【英文标题】：React-Router - Uncaught TypeError: Cannot read property 'getCurrentLocation' of undefined

【发布时间】：2017-04-13 20:07:41

【问题描述】：

我使用的是最新版本的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 开发者工具中得到以下异常：

未捕获的类型错误：无法读取属性“getCurrentLocation”的 未定义

这是为什么呢？我错过了什么？

【参考方案1】：

遇到同样的错误，这样解决了：

添加

var hashHistory = ReactRouter.hashHistory;

并且在Router中设置history等于hashHistory

<Router history=hashHistory>

所以在你的情况下：

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

【参考方案2】：

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

查看histories documentation 了解更多信息。