转自:

https://blog.csdn.net/yingzizizizizizzz/article/details/78751305

场景:

一个组件中,含有ul展开数组的组件,在每一行中,都能点击相应的这一行,跳转到对应的页面。

也就是说,组件套组件,子组件中this.props.history.push无法工作。提示没有push这个函数。

因为这时的props中没有history这个属性。

解决办法:

在父组件中,传递一个history。

子组件中用history.push   就可以啦

参考资料:

https://segmentfault.com/a/1190000011137828

<NowplayingChild {...this.props} ></NowplayingChild> //将父组件的属性传递给子组件,否则子组件可能没有属性props,这里用的是属性的简写
<li key={item} onClick={this.handleClick.bind(this,item)}>{item}</li>//子组件的写法
handleClick(id){
//编程式导航
console.log(this.props);
this.props.history.push("/detail/"+id);
}

使用react——解决this.props.history.push无法跳转的问题的更多相关文章

  1. React history.push()无法跳转 url改变页面不渲染

    一.history.push()无法跳转参考了很多文章 研究一下生命周期 render是要有state变化才会执行 BrowserHistory只有props变化 无法触发render 如下改造环境 ...

  2. react-router v4 使用 history 控制路由跳转

    问题 当我们使用react-router v3的时候,我们想跳转路由,我们一般这样处理 我们从react-router导出browserHistory. 我们使用browserHistory.push ...

  3. react native中props的使用

    react native中props的使用 一.props的使用 1:父组件传递的方式 在子组件中可以用this.props访问到父组件传递的值 <View> <Text> { ...

  4. React中render Props模式

    React组件复用 React组件复用的方式有两种: 1.render Props模式 2.高阶组件HOC 上面说的这两种方式并不是新的APi. 而是利用Raect自身的编码特点,演化而来的固定编码写 ...

  5. vue-router同路由$router.push不跳转一个简单解决方案

    vue-router同路由$router.push不跳转一个简单解决方案 vue-router跳转一般是这么写: toCurrentPage: function(thisId){ this.$rout ...

  6. iOS - 模态Model视图跳转和Push视图跳转的混合需求实现原理

    在研发中总会遇到一些莫名的需求,本着存在即合理的态度跟大家分享一下"模态Model视图跳转和Push视图跳转的需求实现",本文仅仅传授研发技术不传授产品以及UE的思想,请大家合理对 ...

  7. 解决uni-app props 传递数组修改后不能使用问题

    1.子组件页面结构 //NoticesMarquee 组件 <view v-for="(item, index) in tempList" :key="index& ...

  8. React系列之--props属性

    版权声明:本文为博主原创文章,未经博主允许不得转载. PS:转载请注明出处作者:TigerChain地址:http://www.jianshu.com/p/fa81cebac3ef本文出自TigerC ...

  9. A Bite Of React(2) Component, Props and State

    component component:用户自己定义的元素 const element = <Welcome name="Sara" />; class Welcome ...

随机推荐

  1. C#-WebForm-★★★JQuery知识——DOM操作★★★

    例如: $("#btn1").attr( "disabled" , "disabled" ); 例如: $("#d1") ...

  2. HDU - 6133 启发式合并

    题意:给出一棵树共\(n\)个顶点,每个顶点有一个权值\(val_i\),你需要对每个节点统计一个最优解 每个节点的解按照一定规则产生:取出该节点的子树下所有的顶点,把顶点任意排序成一个序列,设为\( ...

  3. C#以管理员权限运行源码,C#软件获取管理员权限,c#获取管理员权限

    C#以管理员权限运行源码,C#软件获取管理员权限,c#获取管理员权限 发布时间:2014-10-19 21:40内容来源:未知 点击: 次 windows 7和vista提高的系统的安全性,同时需要明 ...

  4. Hibernate中Query.list()方法报IllegalArgumentException异常

    最近在使用Hibernate开发项目,在写好hql语句,并初始化Query对象,执行Query.list()方法时,应用报IllegalArgumentException异常.经网上查询,现已经基本决 ...

  5. PHP加密解密数字,适用于URL加密。

    本博主最近正在建设一个9元包邮的网站,希望各位光临指导一些意见: 9元包邮 http://www.jiubaou.com/ <?php /** * 加密解密类 * 该算法仅支持加密数字.比较适用 ...

  6. IDEA里如何多种方式打jar包,然后上传到集群

    关于IDEA里如何多种方式打jar包,然后上传到集群的问题? 前期准备,就是在,IDEA里,maven来创建项目.这里不多赘述. 1)用maven项目来打包,我推荐这个. (强烈推荐,简单又快速) S ...

  7. c++ 网络编程课设入门超详细教程 ---目录

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/9663167.html c++ 网络编程(一)TCP/UDP windows/linux 下入门 ...

  8. C 标准库 - ctype.h之isalpha使用

    isalpha int isalpha ( int c ); Checks whether c is an alphabetic letter. 检查给定字符是否字母字符,即是大写字母( ABCDEF ...

  9. sourceTree git 空目录从远程仓库克隆代码出现warning: templates not found

    解决办法: 在安装git时没有默认安装到c盘,而是安装到了d盘.在使用SourceTree进行代码克隆时提示warning: templates not found in D:\software\de ...

  10. 重温js基础部分

    临近面试,因此打算回过头来巩固一下js的一些基础部分,同时也是为了记录自己的一些比较薄弱的点. 1.typeof操作符 typeof返回一个基本数据类型,包括number,string,boolean ...