react 路由跳转问题
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 路由跳转问题的更多相关文章
- 「实践篇」解决微前端 single-spa 项目中 Vue 和 React 路由跳转问题
前言 本文介绍的是在做微前端 single-spa 项目过程中,遇到的 Vue 子应用和 React 子应用互相跳转路由时遇到的问题. 项目情况:single-spa 项目,基座用的是 React,目 ...
- vue 和 react 路由跳转和传参
react 1 .跳转方式加传参 this.props.history.push({ //地址 pathname: '/film/Details', //路由传参 ...
- 解决React路由跳转时出现的红色警告: Warning: Failed prop type: Invalid prop `component` of type `object` supplied to `Route`, expected `function`.
一.报警如图: 二.查找路由版本 我使用路由版本是4.3.1的,然后我测试所有4.0+版本都会出现以上警告. 三.未解决前的代码 三.我又解读了一下报警告内容的大致意思:就是props需要通过函数返回 ...
- react项目中引入了redux后js控制路由跳转方案
如果你的项目中并没有用到redux,那本文你可以忽略 问题引入 纯粹的单页面react应用中,通过this.props.history.push('/list')就可以进行路由跳转,但是加上了redu ...
- react第十四单元(react路由-react路由的跳转以及路由信息)
第十四单元(react路由-react路由的跳转以及路由信息) #课程目标 理解前端单页面应用与多页面应用的优缺点 理解react路由是前端单页面应用的核心 会使用react路由配置前端单页面应用框架 ...
- react第十三单元(react路由-react路由的跳转以及路由信息) #课程目标
第十三单元(react路由-react路由的跳转以及路由信息) #课程目标 熟悉掌握路由的配置 熟悉掌握跳转路由的方式 熟悉掌握路由跳转传参的方式 可以根据对其的理解封装一个类似Vue的router- ...
- 【React踩坑记二】react项目实现JS路由跳转
这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...
- react中路由跳转push与replace的区别
路由跳转,replace / push 区别 push: a-b-c 可以回到上一级 例: this.props.history.push('路由地址') replace: a-b-c 回不到上一级 ...
- React native路由跳转navigate、push、replace的区别
由于没有系统的去学习RN,对路由跳转了解不多,只是跟着项目在做,抽点时间简单学习一下RN路由跳转方法区别,总结如下: 如上图,外部是一个栈容器,此时A页面在最底部,navigate到B页面,为什么此时 ...
随机推荐
- Windows添加用户和组命令
查看当前存在用户: net user 查看当前用户组: net localgroup 添加用户(以添加用户ls密码abcd1234为例): net user ls abcd1234 /add 添加用户 ...
- 小程序WXSS布局
1. 尽量采用flex 布局,指定flex-direction是row( 从左到右)还是column (从上到下) 特别要记得写 flex-wrap: wrap; 不然超出屏幕部分不会换行 displ ...
- 码云git使用三(本地代码合并)
现在我们已经学会了把“本地代码上传至码云git服务器”和“从码云git服务器下载代码到本地”. 我们现在学习怎么上传代码到服务器注意事项和步骤. 1.我们修改代码后,我们需要先+Add后再Commit ...
- 微信小程序开发工具
微信小程序 1● 工具下载 https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 2● webchart_devto ...
- Sql server2008如何导入Excel文件数据?
sql server 中如何使用Excel文件导入数据?我做个测试,首先建立一个测试表(民族表) --创建一个民族表-- create table BdsNation( Uid int not nul ...
- global 全局变量 nonlocal 局部变量
# x= # def func(): # x= # # func() # print(x) # x=[] # def func(): # x.append() # x.append() # x.app ...
- java高级⑴
1.之前我们学过 数组: 数组的特点: 01. 长度一旦被定义,不允许被改变 02. 在内存中开辟一连串连续的空间! 那么现在有一个需求: 让我们定义一个数组 来 保存 新闻信息!!! 问题: 01. ...
- day24 模块03_re
休养生息 --模块03 1.正则表达式 2.在python中使用正则.re 一,正则表达式 (匹配字符串,主要是给字符串使用的) 1)元字符 . 除换行符之外 \w 数字,字母,下划线组成 \W ...
- c算法:字符串查找-KMP算法
/* *用KMP算法实现字符串匹配搜索方法 *该程序实现的功能是搜索本目录下的所有文件的内容是否与给定的 *字符串匹配,如果匹配,则输出文件名:包含该字符串的行 *待搜索的目标串搜索指针移动位数 = ...
- SQL-29 使用join查询方式找出没有分类的电影id以及名称
题目描述 film表 字段 说明 film_id 电影id title 电影名称 description 电影描述信息 CREATE TABLE IF NOT EXISTS film ( film_i ...