基于 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. redis缓存设置和读取

    一/写入 <?php $redis = new Redis(); //实例化redis $redis->pconnect('); $redis->,'huahua'); //设置变量 ...

  2. Java 8 新日期时间 API

    Java 8 新日期时间 API 1. LocalDate.LocalTime.LocalDateTime LocalDate.LocalTime.LocalDateTime 实例是不可变的对象,分别 ...

  3. struts2乱码问题

    简介:做了个功能,用的struts2,表单提交到后台,接收后打印出来的数据乱码.   解决步骤: 1. struts.xml中配置<constant name="struts.i18n ...

  4. Devexpress VCL Build v2013 vol 13.2.5 发布

    支持xe6 了,但是承诺的功能在哪里? What's New in 13.2.5 (VCL Product Line)   New Major Features in 13.2 What's New ...

  5. 2018.10.20 bzoj2748: [HAOI2012]音量调节(背包)

    传送门 这题是不是太sbsbsb了一点. 难度直逼普及-. 直接背包判存在性就行了. 代码: #include<bits/stdc++.h> using namespace std; bo ...

  6. 2018.08.20 loj#117. 有源汇有上下界最小流(模板)

    传送门 这题真有意思... 先是有一个点T的我怀疑人生. 然后学大佬们封装了我的dinic就莫名其妙的过了??? 所以说锅给谁好呢? 给dinic吧... 解法就是先求出一段可行流,然后从t到s加一条 ...

  7. ssh到远程执行命令并返回

    假设有三台机器 host1,host2,host3,host1能免密登录其他两台.要在第一台的机器里面写一个脚本分别删除每台机器的/root/test.txt rm -rf /root/test.tx ...

  8. Javascript 中函数的 length 属性

    每个函数都有一个 length属性 (函数名.length), 表示期望接收的函数的个数(而不是实际接收的参数个数) 它与arguments不同. arguments.length 是表示函数实际接收 ...

  9. IT人员如何有效规划自己时间

          中午和任职 DBA 的朋友聊天,他说:"老板老是要我把工作时间填长一点,让整个部门的工作时间比较好看,所以本来做 1 个小时的事要写 3 个小时."但我回答说若这件事情 ...

  10. [program]编程习惯总结(2015_11_25)

    1. 前端页面不要的数据,那么后端就不要发送到前端: 如:我们根据各个大洲来建立了一个个大洲的讨论区,但是在发表讨论页面.我们却希望用户去选择与当前帖子相关的国家标签. 那么,我们只需要在后台使用国家 ...