基于 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. Laravel5.4 Oauth2.0认证应用 API 实战!

    项目初始化 新建项目 lukeyans-MacBook-Pro:laravel lukeyan$ laravel new laravel_demo 添加laravel自带的Passport服务 luk ...

  2. [SoapUI] 在执行某个TestSuite之前先执行login或者其他什么前置步骤

    打开TestSuite有一个地方可以设置Setup Script import com.eviware.soapui.model.support.PropertiesMap log.info &quo ...

  3. tensorflow的transpose

    从图中看出来perm=[1,0,2] 表示第一个维度和第二个维度进行交换. 默认的是[0,1,2]   所以perm=[1,0,2] 表示第一个维度和第二个维度进行交换.0,1,2表示index.

  4. setTimeout setInterval 详解

      http://www.jb51.net/article/74606.htm   var tttt=setTimeout('northsnow()',1000);//执行一次 clearTimeou ...

  5. EPLAN 软件平台中的词“点“大全

    1. 中断点(Interruption Point):     在原理图绘制时,如果当前绘图区域的空间不足,需要转到其它页面继续绘制,而这两页之间存在连续的“信息流“时,可以使用“中断点“来传递这种“ ...

  6. 2018.09.15 hdu1599find the mincost route(floyd求最小环)

    传送门 floyd求最小环的板子题目. 就是枚举两个相邻的点求最小环就行了. 代码: #include<bits/stdc++.h> #define inf 0x3f3f3f3f3f3f ...

  7. [GO]小技巧,如何实现一个链式操作

    package main import "fmt" type Stu struct { Name string Age int } func (p *Stu) SetName(na ...

  8. 【Unity】2.3 项目浏览器和资源的组织

    分类:Unity.C#.VS2015 创建日期:2016-03-29 一.Project-工程浏览器 前面我们说过,Unity中的Project View(称为工程浏览器)相当于VS2015中的解决方 ...

  9. spring boot使用java读取配置文件,DateSource测试,BomCP测试,AnnotationConfigApplicationContext的DataSource注入

    一.配置注解读取配置文件         (1)@PropertySource可以指定读取的配置文件,通过@Value注解获取值   实例:           @PropertySource(val ...

  10. Nios ii调试问题集

    如果定义了一个类的.hpp,而在相应的.cpp中定义其中的函数时,根本找不到定义的类,这说明类在定义时出错,要注意类括号后的冒号. 2. 问题1:NiosII/Eclipse 中遇到“Launchin ...