reactjs - 反应路由器v4以编程方式更改路由

Question

似乎找不到很多关于此的质量文档。React Router v4 文档包含“历史”对象的信息，但声明它是可变的，不应更改。我见过的许多例子看起来像是“黑客”。任何见解将不胜感激。

Answer 1

作为一个反应新手，我不得不努力解决这个问题一段时间。虽然@ToddChaffee 提供的链接为您提供了很好的洞察力，但此线程强调当您将历史对象<Router/>作为顶级组件时，它会自动作为道具传递。这比单独加载历史对象并使用该createBrowserHistory()方法要简单得多。

以下对我有用：

<Route exact path='/' render={({history}) => 
  <Home infoHandler={this.handleUserInfo} 
    imageHandler={this.handleImage} 
    history={history}/>
}/>

然后在组件内部，您可以：

this.props.history.push('/routeYouWantToGoTo');

在导出模块之前，不要忘记对组件中的 prop 进行类型检查：

Home.propTypes = {
  history: React.PropTypes.object
}

export default Home;