React-Router push仅更改URL并且不会导航

Question

我正在尝试使用react-router以编程方式导航，但我似乎无法这样做。

我已阅读其他相关问题，例如this one似乎适用于其他所有人，但无济于事。

我正在使用react-router版本2.4.1，据我所知，它应该通过以下方式完成：

this.context.router.push('/');

甚至：

browserHistory = require('react-router').browserHistory;
//...
var browserHistory.push('/');

但是，无论是否认可，我似乎完成的是URL重写，没有实际的路由。

我的路线注册了＆＃39; /＆＃39;在我的路由器上。

我错过了什么？对于单页应用程序，我距离window.location = '/'几英寸远:(

Answer 1

我知道这已经有几个月了，但万一有人遇到类似的问题。

一个简单的修复可能是添加此代码：

static contextTypes = {
  router: PropTypes.object,
};

然后你可以使用： this.context.router.push('/foo');

Reference

Answer 2

因此，显然是摆弄背景和儿童的第三方组成部分应该受到指责。删除它，现在它按预期工作。

如果有人面对此问题，请尝试查看路线上的组件如何处理上下文和子项。

Answer 3

以下代码是导航的工作示例

要导航的代码，

handleClick(e) {
    e.preventDefault();
    this.context.router.push('/aboutus');
  }

对于React Component，不要忘记引用Context

Item.contextTypes = {
  router: PropTypes.object.isRequired
};