1.采用Link方法跳转

<Link to="/Index2" >

不要用link,回不来,也不能next

</Link>

2.用context控制路由跳转:

通过添加一个点击事件:绑定一个函数

usb(event){
const path='/Index2';
this.context.router.push(
{
pathname:path
});
}

然后在export之前添加以下代码,此处必须
Content_ship.contextTypes={
router:React.PropTypes.object
}

Content_ship为必须,Content_ship为当前页面封装的组件

usb(event){
const path='/Index2';
this.context.router.push(
{
pathname:path
});
}

react 路由跳转问题的更多相关文章

  1. 「实践篇」解决微前端 single-spa 项目中 Vue 和 React 路由跳转问题

    前言 本文介绍的是在做微前端 single-spa 项目过程中,遇到的 Vue 子应用和 React 子应用互相跳转路由时遇到的问题. 项目情况:single-spa 项目,基座用的是 React,目 ...

  2. vue 和 react 路由跳转和传参

                      react  1 .跳转方式加传参 this.props.history.push({ //地址 pathname: '/film/Details', //路由传参 ...

  3. 解决React路由跳转时出现的红色警告: Warning: Failed prop type: Invalid prop `component` of type `object` supplied to `Route`, expected `function`.

    一.报警如图: 二.查找路由版本 我使用路由版本是4.3.1的,然后我测试所有4.0+版本都会出现以上警告. 三.未解决前的代码 三.我又解读了一下报警告内容的大致意思:就是props需要通过函数返回 ...

  4. react项目中引入了redux后js控制路由跳转方案

    如果你的项目中并没有用到redux,那本文你可以忽略 问题引入 纯粹的单页面react应用中,通过this.props.history.push('/list')就可以进行路由跳转,但是加上了redu ...

  5. react第十四单元(react路由-react路由的跳转以及路由信息)

    第十四单元(react路由-react路由的跳转以及路由信息) #课程目标 理解前端单页面应用与多页面应用的优缺点 理解react路由是前端单页面应用的核心 会使用react路由配置前端单页面应用框架 ...

  6. react第十三单元(react路由-react路由的跳转以及路由信息) #课程目标

    第十三单元(react路由-react路由的跳转以及路由信息) #课程目标 熟悉掌握路由的配置 熟悉掌握跳转路由的方式 熟悉掌握路由跳转传参的方式 可以根据对其的理解封装一个类似Vue的router- ...

  7. 【React踩坑记二】react项目实现JS路由跳转

    这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...

  8. react中路由跳转push与replace的区别

    路由跳转,replace / push 区别 push: a-b-c 可以回到上一级 例: this.props.history.push('路由地址') replace: a-b-c 回不到上一级 ...

  9. React native路由跳转navigate、push、replace的区别

    由于没有系统的去学习RN,对路由跳转了解不多,只是跟着项目在做,抽点时间简单学习一下RN路由跳转方法区别,总结如下: 如上图,外部是一个栈容器,此时A页面在最底部,navigate到B页面,为什么此时 ...

随机推荐

  1. C++ 保留有效小数 保留有效数字

    1.需要头文件 #include <iomanip> 2. 要保留两位有效小数 cout<<setiosflags(ios::fixed)<<setprecisio ...

  2. weex npm 报错 cb() never called!

    安装环境:windows7 使用npm 安装 出现错误后网上查找并没有解决,在准备放弃的时候试着用cnpm安装了一下,结果安装成功了,感觉应该网络问题,不知原因但完美解决

  3. mongodb细节

    MongoDB中数值型默认为Double,可以使用NumberInt()函数及NumberLong()函数分别指定某个字段为整型和长整型.

  4. oo作业总结(一)

    概述 经历了三次oo作业的洗礼,让我对java语言的强大以及面向对象编程有了初步的理解(当然,我是小白).本文接下来就将对自己这三次作业的代码进行分析以及分享自己的心路历程. 基础知识点考核 针对前三 ...

  5. JDBC:随机生成车牌号,批量插入数据库

    package InsertTest; /* * 单客户端:批量插入 */ import java.sql.Connection; import java.sql.DriverManager; imp ...

  6. 双引号与尖括号的区别 and 相对路径与绝对路径

    包含头文件的时候,如果包含的是自己写的头文件是用" " .如果是包含系统的头文件,一般用<>. 相对路径与绝对路径

  7. 某些material英文翻译

    chrome  铬,铬合金, 镀铬 matte  无光泽的,不光滑的 Decal   陶瓷的 duo color  双色 livery  (这个没找到什么吊意思,我看像是一个类似打logo的材质)

  8. 重载的方式写Python的post请求

    #encoding=utf-8#__author__="Lanyangyang" import unittestimport requestsimport json # This ...

  9. 开发框架DevExtreme全新发布v18.2.6|附下载

    DevExtreme Complete Subscription是性能最优的 HTML5,CSS 和 JavaScript 移动.Web开发框架,可以直接在Visual Studio集成开发环境,构建 ...

  10. DevExpress Windows 10 UWP Controls新版亮点

    行业领先的.NET界面控件2018年第二次重大更新——DevExpress v18.2日前正式发布,本站将以连载的形式为大家介绍新版本新功能.本文将介绍了DevExpress Windows 10 U ...