[英]History object issue with React-Router
我正在使用React和React Router构建一个非常简单的网页。 我使用NPM安装了最新版本的React Router模块(v3.0.0),在index.js文件中编写了3条非常简单的路由:
import React, {Component} from 'react';
import {render} from 'react-dom';
import {Router, Route} from 'react-router';
//Import custom components
import About from '../components/about.js';
import Contact from '../components/contact.js';
import Sidebar from '../components/sidebar.js';
import Imagelist from '../components/image-list.js';
render(
<Router>
<Route component={Sidebar}>
<Route path="/" component={Imagelist}/>
<Route path="/about" component={About}/>
<Route path="/contact" component={Contact}/>
</Route>
</Router>,
document.getElementById('content')
);
但是当我尝试在本地打开页面时,我不断在控制台中收到此错误:
未捕获的TypeError:无法读取未定义的属性'getCurrentLocation'(...)
当我检查错误时,此行在Router.js中突出显示:
您已提供使用history v2.x或更早版本创建的历史记录对象。 此版本的React Router仅与v3历史对象兼容。 请升级到历史v3.x.
我已经尝试使用NPM安装此历史模块的v3但我仍然收到此错误。 我甚至不确定这是错误要求我做的。 任何人都可以告诉我,如果我做对了吗?
它可能是来自react-router 3.0的错误,因为我没有找到任何地方说它需要传递文档的history
。 但您只需要将其中一个历史选项传递给Router
。 我甚至看过一个没有通过文档历史的例子,这可能已经过时了。
基本上你需要做的就是:
import {Router, Route, browserHistory} from 'react-router';
...
return (
<Router history={browserHistory}>
<Route component={Sidebar}>
<Route path="/" component={Imagelist}/>
<Route path="/about" component={About}/>
<Route path="/contact" component={Contact}/>
</Route>
</Router>
);
...
在这里查看更多详细信息https://github.com/ReactTraining/react-router/blob/master/docs/guides/Histories.md
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.