基于 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. 配置 Mysql 支持远程访问 并取消域名解析以提高链接速度

    1 配置远程访问 1.1 修改 my.cnf [mysqld] 段 bind-address = 0.0.0.0 //支持所有 ipv4 1.2 建立远程访问用户 mysql> grant al ...

  2. [SoapUI] How to create a random UUID in each Request's Headers

    ${=java.util.UUID.randomUUID()}  is OK

  3. winsock select 学习代码(1)

    // SelectCli.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <winsock2.h> #incl ...

  4. 20145226夏艺华 《Java程序设计》第8周学习总结

    教材学习内容总结 学习目标 了解NIO 会使用Channel.Buffer与NIO2 会使用日志API.国际化 会使用正则表达式 了解JDK8增强功能 第14章 NIO与NIO2 14.1 认识NIO ...

  5. Mac下PHP+MySQL+Apache2环境搭建

    本机系统信息如下: -------------------------------------------------------------------------------------- OS: ...

  6. 说说wee sing(ZZ)

    我自己在当当上买过wee sing,也在网上下了wee sing 的DVD,也借过同事在淘宝上买的Wee sing 套装(9cd + 5DVD).所以对这套资料还是很熟悉的.      淘宝上的套装卖 ...

  7. 2018.08.10 atcoder Median Sum(01背包)

    传送门 题意简述:输入一个数组an" role="presentation" style="position: relative;">anan. ...

  8. UVa 12174 Shuffle (滑动窗口)

    题意:你正在使用的音乐播放器有一个所谓的乱序播放功能,即随机打乱歌曲的播放顺序.假设一共有s首歌, 则一开始会给这s首歌随机排序,全部播放完毕后再重新随机排序.继续播放,依次类推.注意,当s首歌播放完 ...

  9. python 爬取网页内容

    #encoding:UTF-8 import urllib import urllib.request import bs4 from bs4 import BeautifulSoup as bs d ...

  10. android build.gradle(groovy)

    一.build.Gradle 这个 build.Gradle 文件来自 drakeet 大神的 Meizi 项目我直接在代码上加注释,参照着注释看代码就行,是不是发现有很多代码平时都没看见过. //M ...