gre*_*reW 0 reactjs react-router
我正在尝试使用ReactJS的基本内容,我正在尝试了解如何使用React-Router
这是我的代码:
var React = require('react');
var ReactDOM = require('react-dom');
var Router = require('react-router').Router;
var Route = require('react-router').Route;
const Home = React.createClass({
render: function() {
return (<h1>Welcome to the Home Page</h1>);
}
});
ReactDOM.render((
<Router>
<Route path="/" component={Home} />
</Router>
), document.getElementById('root'));
Run Code Online (Sandbox Code Playgroud)
我一直收到以下错误:
未捕获的TypeError:无法读取未定义的属性'getCurrentLocation'(...)
我正在使用webpack将jsx编译成js,我错过了什么?(顺便说一下,webpack没有错误)
谢谢!
您缺少路由器的历史记录定义:
<Router history={hashHistory|browserHistory|createMemoryHistory}>
<Route path="/" component={Home} />
</Router>Run Code Online (Sandbox Code Playgroud)
注意:您必须使用React路由器将所选历史记录类型添加到导入中,因此如果您选择添加browserHistory,则导入将如下所示:
import { browserHistory, Router, Route } from 'react-router'
^---added as a named importRun Code Online (Sandbox Code Playgroud)
对不同选项的简要说明:
browserHistory:以路径'/'开头的完整URL路径.因此,如果您的SPA位于www.myapp.com,则www.myapp.com/默认情况下根路径将同步到.因此,如果您想要路由www.myapp.com/blog,则需要定义路由器路径' /blog'.
hashHistory:做同样的事情,但root从#url中找到的第一个字符开始:example.com/#/some/path对应于:/some/path
createMemoryHistory:用于测试和服务器呈现.此选项不会读取或操作地址栏.
查看:React Router Histories了解更多信息