react-router-dom 手动控制路由跳转
基于 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 手动控制路由跳转的更多相关文章
- 【React踩坑记二】react项目实现JS路由跳转
这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...
- vue路由--使用router.push进行路由跳转
手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 route-link是在html中静态定 ...
- router.push query 路由 跳转 传参使用
this.$router.push({path:'/shop',query:{ goods_name:goods_name, goods_price:goods_price, uid:goods_pr ...
- React router 4 获取路由参数,跨页面参数
1. match通过路径 <Route path="/path/:name" component={example} /> 路由组件内获取参数使用 this.props ...
- React:快速上手(6)——掌握React Router
React:快速上手(6)——掌握React Router 引入Router 安装 npm install react-router-dom 基础组件 React Router中有三种类型的组件:路由 ...
- React Router学习笔记(转自阮一峰老师博客)
React Router是一个路由库,通过管理URL来实现组件切换和状态转变. 1.安装和使用 $ npm install -S react-router 在使用时,作为React组件导入 impor ...
- vue里使用element饿了么的el-menu+vue-router实现路由跳转的两种方法
最近准备写一个echarts的可视化展示案例,首先用vue-cli3创建了一个项目(好像vue-cli4也出来,感觉变化不大,就没升级了) 然后,开始配置路由↓下面是我的router.js文件 imp ...
- react router @4 和 vue路由 详解(七)react路由守卫
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 12.react路由守卫? a.在之前的版本中,React Router 也提供了类似的 ...
- react router @4 和 vue路由 详解(全)
react router @4 和 vue路由 本文大纲: 1.vue路由基础和使用 2.react-router @4用法 3.什么是包容性路由?什么是排他性路由? 4.react路由有两个重要的属 ...
随机推荐
- 那些你不知道的PS大片摄影
你以为这张照片是P出来的? 才不是! 人家是开个起重机吊着拍的! 而且没有任何保护措施! 这样的照片战斗民族的摄影师才敢这样拍…要是在天朝这么做估计都找不到模特… 这张照片出自乌兹别克斯坦的摄影师Ra ...
- using directive 使用指令,与using declaration使用声明。
使用指令是把名字空间中的所有名字引入到当前作用域,而使用声明是把名字空间的某个名字引入到当前作用域中 语法如下 //test.cpp #include<iostream> //using ...
- Windows游戏找不到了怎么办?
大家有的时候,可能是不慎操作,或是某些新装的Windows,会发现那些经典的游戏不见了,那它们去哪了呢?是长腿跑了?还是Windows偷工减料?都不是,让巩固来教你们把他们找出来! 1.在开 ...
- 2018.09.02 bzoj1003: [ZJOI2006]物流运输(dp+最短路转移)
传送门 dp好题. 每一天要变更路线一定还是走最短路. 所以l~r天不变更路线的最优方案就是把l~r天所有不能走的点都删掉再求最短路.显然是可以dp的. 设f[i]表示第i天的最优花销.那么我们枚举在 ...
- APMServ—优秀的PHP集成环境工具
经常折腾wordpress和各种php开发的cms,免不了要在本地测试这些程序,所以选择一款好的php集成环境就至关重要啦.之前在月光博客上看到有一篇“常见的WAMP集成环境”介绍,然后先后试用过XA ...
- python小练习--属性
箭头这个作业: class Box:#定义一个类名为Box,类名后不必有括号,类包含类属性和类方法,这个类没有定义类属性 '''这是一个计算体积的类'''#这是这个类的__doc__属性,执行类后就可 ...
- 玩转Nodejs的集群
在Nodejs中使用集群还是不容易的.Javascript的单线程属性让nodejs下的应用很难使用现代机器的多核特性.比如下面的代码实现了一个http服务器的主干部分.这部分代码只会执行在一个线程上 ...
- 记spring mvc传入List<Object>的一次尝试
首先,看一段异常: org.springframework.http.converter.HttpMessageNotReadableException: Could not read documen ...
- Python学习-18.Python中的错误处理(三)
在某些情况下,我们需要定义自己的异常并且抛出 先定义一个错误: class MyError(BaseException): def __init__(self): pass 上面定义了一个叫MyErr ...
- ListView的另一种可读性更强的ViewHolder模式写法
常见的写法是这样的: @Override public View getView(int position, View convertView, ViewGroup parent) { ViewHol ...