React-Router - 未捕獲TypeError：無法讀取未定義的屬性'getCurrentLocation'

Question

我正在使用最新版本的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

這是爲什麼？我錯過了什麼？

Answer 1

您不會將歷史傳遞給您的<Router>。

查看histories documentation瞭解更多信息。

Answer 2

有同樣的錯誤，解決了這種方式：

添加

var hashHistory = ReactRouter.hashHistory; 

並在路由器設置的歷史等於hashHistory

<Router history={hashHistory}> 

所以你的情況：

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