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路由有两个重要的属 ...
随机推荐
- Ui设计流行趋势,对颜色的探讨
设计风向转换的趋势越来越短,在设计圈中,流行设计的跟新换代更是快.在设计时间越来越短的今天,在经理领导不断催促的时下,如何准确的把握当下的流行趋势,如何在设计之初就能定好设计的基调.这对于还是刚入设计 ...
- 美团点评2017校招笔试真题-算法工程师B
美团点评2017校招笔试真题-算法工程师B 1.以下关于经典的k-means聚类的说法哪个是错误的? A:k-means聚类算法是全局收敛的 B:k-means的聚类结果和初始聚类中心点的选取有关 C ...
- 2018.09.15 poj1734Sightseeing trip(floyd求最小环)
跟hdu1599差不多.. 只是需要输出方案. 这个可以递归求解. 代码: #include<iostream> #include<cstdio> #include<cs ...
- spring boot web项目在IDEA下热部署解决办法(四步搞定)
最近在用spring boot 做一个web站点,修改了类.html.js等,刷新页面,没有生效,非要手动去make一下或者重启,大大降低了开发效率. 什么是热部署? 应用启动后会把编译好的Class ...
- 类内初始值(c++11)
1.概念 1)可以为数据成员提供一个类内初始值,创建对象时,类内初始值用于初始化数据成员,没有初始值的成员将被默认初始化 2)类内初始值和赋值类似,或者放在花括号里(如数组),或者放在等号右边,不能使 ...
- HDU 1050 Moving Tables (贪心)
题意:在一个走廊两边都有对称分布的连续房间,现在有n张桌子需要从a移动到b房间.每次移动需要10分钟, 但是如果两次移动中需要经过相同的走廊位置,则不能同时进行,需要分开移动.最后求最少需要多长时间移 ...
- 新浪微博mid和url的互算
我们在使用新浪微博API时,有时需要得到一个微博的url,但是如statuses/public_timeline等接口中取得的微博status的字段中并没有包含.不过,status中包含了一个mid字 ...
- 配置 struts2 时掉进 web.xml 的坑
这个声明不好用 <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN&quo ...
- hdu 1348 凸包模板
http://acm.hdu.edu.cn/showproblem.php?pid=1348 造城墙问题,求出凸包加上一圈圆的周长即可 凸包模板题 #include <cstdio> #i ...
- application cache 应用缓存
这些应用还是要自己实现一遍,否则真不知道哪里会出问题. 客户端: <!DOCTYPE html> <html manifest = 'demo.appcache'> <h ...