关于React-Router v4的文档，官网其实最值得参考：
react-router/packages/react-router/docs/api at master · ReactTraining/react-router
和：
React Router: Declarative Routing for React.js
其他不错的资料：
react-router2 迁移到 react-router4 关注点 · Issue #6 · gmfe/blog
解释的很清楚了。
有空自己再去整理。
1.代码中跳转页面，不能用：
this.context.router.push(‘/urltoJump’); |
或：
this.context.router.transitionTo(‘/urltoJump’); |
了，而是改用：
（1）推荐：withRouter
class Login extends Component { this.props.history.push(‘/rse_web/main’); } export default withRouter(Login); |
即：
用withRouter去封装包装Component后，该Component的props中就有了match，location，history这些属性了，就可以用props.history去push实现页面跳转了。
（2）不推荐：借用this.context的：
this.context.router.history.push(‘/urlToJump’); |
提示：
如果想要使用this.context.router.history.push，则需要需要给Component加上contextTypes：
export default class Login extends Component { …. this.context.router.history.push(‘/main’); } Login.contextTypes = { router: PropTypes.object.isRequired }; |
2.react-router v4中，对于加入了router中的Component，则自动（被注入了）就有了match，location，history参数了。
所以上面withRouter的方式中，可以使用：
this.props.history.push
去页面跳转。
其中history中常用的属性有：
ength -（ number 类型）指的是 history 堆栈的数量。 action -（ string 类型）指的是当前的动作（action），例如 PUSH，REPLACE 以及 POP 。 location -（ object类型）是指当前的位置（location），location 会具有如下属性： pathname -（ string 类型）URL路径。 search -（ string 类型）URL中的查询字符串（query string）。 hash -（ string 类型）URL的 hash 分段。 state -（ string 类型）是指 location 中的状态，例如在 push(path, state) 时，state会描述什么时候 location 被放置到堆栈中等信息。这个 state 只会出现在 browser history 和 memory history 的环境里。 push(path, [state]) -（ function 类型）在 hisotry 堆栈顶加入一个新的条目。 replace(path, [state]) -（ function 类型）替换在 history 堆栈中的当前条目。 go(n) -（ function 类型）将 history 对战中的指针向前移动 n 。 goBack() -（ function 类型）等同于 go(-1) 。 goForward() -（ function 类型）等同于 go(1) 。 block(prompt) -（ function 类型）阻止跳转 |
抽空再好好看看：
React Router v4 Unofficial Migration Guide – codeburst
react-router v4变化
【相关内容和参考资料】
【已解决】ReactJS中Uncaught TypeError this.context.router.push is not a function
【已解决】ReactJS中react-router v4的this.context.router.history.push无法跳转页面
reactjs – Programmatically navigate using react router V4 – Stack Overflow
reactjs – How to push to History in React Router v4? – Stack Overflow
如何在react-router-v4中通过代码跳转子路由？ – 提问 – React 中文
转载请注明：在路上 » 【整理】React-Router v4的心得和注意事项和参考资料