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. Windows添加用户和组命令

    查看当前存在用户: net user 查看当前用户组: net localgroup 添加用户(以添加用户ls密码abcd1234为例): net user ls abcd1234 /add 添加用户 ...

  2. 小程序WXSS布局

    1. 尽量采用flex 布局,指定flex-direction是row( 从左到右)还是column (从上到下) 特别要记得写 flex-wrap: wrap; 不然超出屏幕部分不会换行 displ ...

  3. 码云git使用三(本地代码合并)

    现在我们已经学会了把“本地代码上传至码云git服务器”和“从码云git服务器下载代码到本地”. 我们现在学习怎么上传代码到服务器注意事项和步骤. 1.我们修改代码后,我们需要先+Add后再Commit ...

  4. 微信小程序开发工具

    微信小程序 1● 工具下载 https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html     2● webchart_devto ...

  5. Sql server2008如何导入Excel文件数据?

    sql server 中如何使用Excel文件导入数据?我做个测试,首先建立一个测试表(民族表) --创建一个民族表-- create table BdsNation( Uid int not nul ...

  6. global 全局变量 nonlocal 局部变量

    # x= # def func(): # x= # # func() # print(x) # x=[] # def func(): # x.append() # x.append() # x.app ...

  7. java高级⑴

    1.之前我们学过 数组: 数组的特点: 01. 长度一旦被定义,不允许被改变 02. 在内存中开辟一连串连续的空间! 那么现在有一个需求: 让我们定义一个数组 来 保存 新闻信息!!! 问题: 01. ...

  8. day24 模块03_re

    休养生息 --模块03 1.正则表达式 2.在python中使用正则.re 一,正则表达式 (匹配字符串,主要是给字符串使用的) 1)元字符 .  除换行符之外 \w 数字,字母,下划线组成   \W ...

  9. c算法:字符串查找-KMP算法

    /* *用KMP算法实现字符串匹配搜索方法 *该程序实现的功能是搜索本目录下的所有文件的内容是否与给定的 *字符串匹配,如果匹配,则输出文件名:包含该字符串的行 *待搜索的目标串搜索指针移动位数 = ...

  10. SQL-29 使用join查询方式找出没有分类的电影id以及名称

    题目描述 film表 字段 说明 film_id 电影id title 电影名称 description 电影描述信息 CREATE TABLE IF NOT EXISTS film ( film_i ...