使用history.push无法刷新路由

[TangiDing]

问题描述

使用react做个移动端应用, 布局结构上分为底部选项卡和选项卡上的主体部分, 这边主体部分使用route组件设置为路由,点击选项卡后使用history.push注入新路径, 结果主体部分并没有发生路由跳转。

代码我放在jsbin上, 求大神们指点迷津，谢谢- -

[oyb81076]

react-redux和react-router混用的时候，需要用到react-router-redux, 自己去github上看看吧

[ChuckOu]

• Q5:那么为什么我们使用this.props.history.push（url）出现了问题呢？
• A5:经过查找资料，网上说最新的react-router改版，使用this.props.history.push已经不能够进行跳转了，应该使用this.context.history.push进行

作者：zhangpei
链接：https://www.jianshu.com/p/a89151cbae86
來源：简书

---

你可以试着使用BrowserRouter来进行push，或者自己新建一个history.js文件

npm install history --save-dev

// /src/history.js

import createHistory from 'history/createBrowserHistory';
export default createHistory();

// /src/router.js
  import history from './history'
  ......
  render(){
   return(
     <Router history = {history}>
        ......
     </Router>
   )
}

// /src/page.js
import history from './history'
......

class Test extends React.Component{
   ......
   pushUrl(url){
      history.push(url)
   }
   ......
}

Issue: react-router v4 使用 history 控制路由跳转