javascript - 无法读取未定义的属性 'pushState'

Question

我有一个简单的 React Router 配置。我有另一个基本上用 ... 包装的，它有效。但是这个没有(当然，我尝试使用不同的实现，就像 this post 和许多其他人的答案中所建议的那样。

控制台错误是这篇文章的标题。使用 ES6 和基于散列的路由的 react-router v.1。

看了很多文章，简单的路由实现太没必要了，现在对react和react-router都快恨死了。请帮忙。

    componentWillReceiveProps() {
       this.contextTypes = {
          history: React.PropTypes.object
       }
    },
    _handleRoute(e) {
       e.preventDefault()
       this.history.pushState(null, `/somepath`);
    },
    render() {
        return(
          <div onClick={this._handleRoute}>
            Some Content.
          </div>
        );
      } 

或:

render() {
        return(
          <div>
            <Link to={`/somepath`}> link </Link>
          </div>
        );
      }

Answer 1

React Router v1:

history 对象中有 pushState 方法。

首先，分配给路由器的组件必须将 pushState 方法作为函数属性提供给子组件:

//Router Component
render ()
  return (
    <SomeComponent changeRoute={this.props.history.pushState}
  )

然后，在我想在函数中更改路由的组件中，我只需执行以下操作:

//SomeComponent
onClick() {
  this.props.changeRoute(null, 'somepath', {query: "something"});
}

React Router v.2

import {browserHistory} from 'react-router';

//SomeComponent

browserHistory.push('somepath');