基于 react-router 4.0 版本,我们想要通过 JS 手动控制路由跳转,分三步:

第一步:引入 propTypes

const PropTypes = require('prop-types');

第二步:定义context 的router属性

BottomNavigationExampleSimple.contextTypes = {
router: PropTypes.object
}

第三步:控制跳转

 handleClick= () => {
this.context.router.history.replace('/index')
};

react-router-dom 手动控制路由跳转的更多相关文章

  1. 【React踩坑记二】react项目实现JS路由跳转

    这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...

  2. vue路由--使用router.push进行路由跳转

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 route-link是在html中静态定 ...

  3. router.push query 路由 跳转 传参使用

    this.$router.push({path:'/shop',query:{ goods_name:goods_name, goods_price:goods_price, uid:goods_pr ...

  4. React router 4 获取路由参数,跨页面参数

    1. match通过路径 <Route path="/path/:name" component={example} /> 路由组件内获取参数使用 this.props ...

  5. React:快速上手(6)——掌握React Router

    React:快速上手(6)——掌握React Router 引入Router 安装 npm install react-router-dom 基础组件 React Router中有三种类型的组件:路由 ...

  6. React Router学习笔记(转自阮一峰老师博客)

    React Router是一个路由库,通过管理URL来实现组件切换和状态转变. 1.安装和使用 $ npm install -S react-router 在使用时,作为React组件导入 impor ...

  7. vue里使用element饿了么的el-menu+vue-router实现路由跳转的两种方法

    最近准备写一个echarts的可视化展示案例,首先用vue-cli3创建了一个项目(好像vue-cli4也出来,感觉变化不大,就没升级了) 然后,开始配置路由↓下面是我的router.js文件 imp ...

  8. react router @4 和 vue路由 详解(七)react路由守卫

    完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 12.react路由守卫? a.在之前的版本中,React Router 也提供了类似的 ...

  9. react router @4 和 vue路由 详解(全)

    react router @4 和 vue路由 本文大纲: 1.vue路由基础和使用 2.react-router @4用法 3.什么是包容性路由?什么是排他性路由? 4.react路由有两个重要的属 ...

随机推荐

  1. linux两个线程

    http://blog.csdn.net/marksinoberg/article/details/50945212

  2. Maven系列(十)发布自己的项目到 Maven 中央仓库

    Maven 发布自己的项目到 Maven 中央仓库 可能很多人都在用 Maven 仓库,但是如果要问怎么发布项目到中央仓库,估计很多人都不知道了,下面本篇文章带大家往中央仓库发布一个自己的 Maven ...

  3. 情感分析snownlp包部分核心代码理解

    snownlps是用Python写的个中文情感分析的包,自带了中文正负情感的训练集,主要是评论的语料库.使用的是朴素贝叶斯原理来训练和预测数据.主要看了一下这个包的几个主要的核心代码,看的过程作了一些 ...

  4. 二进制搭建kubernetes多master集群【二、配置flannel网络】

    上一篇我们已经搭建etcd高可用集群,参考:二进制搭建kubernetes多master集群[一.使用TLS证书搭建etcd集群] 此文将搭建flannel网络,目的使跨主机的docker能够互相通信 ...

  5. 浅析10种常见的黑帽seo手法

    虽然博主并不认同黑帽seo手法,但是一些常见的黑帽手法还是需要了解的,增加自己对黑帽的认知,也可以在自己优化网站时适时的规避开这些黑帽手法,从而避免自己的网站被搜索引擎惩罚.好了,话不多说,下面进入今 ...

  6. BZOJ 1008 [HNOI2008]越狱 (简单排列组合 + 快速幂)

    1008: [HNOI2008]越狱 Time Limit: 1 Sec  Memory Limit: 162 MBSubmit: 10503  Solved: 4558[Submit][Status ...

  7. UVa 11134 Fabled Rooks (贪心+问题分解)

    题意:在一个n*n的棋盘上放n个车,让它们不互相攻击,并且第i辆车在给定的小矩形内. 析:说实话,一看这个题真是没思路,后来看了分析,原来这个列和行是没有任何关系的,我们可以分开看, 把它变成两个一维 ...

  8. spring 课程

    官网 参考文档 // 1. Spring_HelloWorld 20:22 // 2. Spring_IOC&DI概述 08:07 // 3. Spring_配置 Bean 21:58 // ...

  9. nexus 下载及安装

    一.下载 nexus maven http://www.sonatype.org/ http://www.sonatype.org/nexus/ http://www.sonatype.org/nex ...

  10. Google Map API申请

    https://code.google.com/apis/console 当然需要先有个Google账户登录. 然后需要建一个项目. 然后根据package+sha1码获取密钥key 然后就可以创建凭 ...