Question

我正在尝试使用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'));

我一直收到以下错误：

未捕获的TypeError：无法读取属性'getCurrentLocation' 未定义的（...）

我正在使用webpack将jsx编译成js，我错过了什么？（顺便说一下webpack没有错误）

谢谢！

Answer 1

您缺少路由器的历史记录定义：

<Router history={hashHistory|browserHistory|createMemoryHistory}>
  <Route path="/" component={Home} />
</Router>

注意：您必须使用React路由器将所选历史记录类型添加到导入中，因此如果您选择添加 browserHistory ，您的导入将如下所示：

import { browserHistory, Router, Route } from 'react-router'
           ^---added as a named import

对不同选项的简要说明：

browserHistory：以路径'/'开头的完整网址路径。因此，如果您的SPA位于www.myapp.com，默认情况下，根路径将同步到www.myapp.com/。因此，如果您想要到www.myapp.com/blog的路由，则需要定义路由器路径“/blog”。

hashHistory：做同样的事情，但根从网址中找到的第一个#字符开始：example.com/#/some/path对应于：/some/path

createMemoryHistory：用于测试和服务器渲染。此选项不读取或操作地址栏。

结帐：React Router Histories了解更多信息

关于React，TypeError的路由：无法读取未定义的属性'getCurrentLocation'（...）

1 个答案: