react中子组件是什么意思-创新互联

这篇文章将为大家详细讲解有关react中子组件是什么意思,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

创新互联专注于成都网站设计、做网站、网页设计、网站制作、网站开发。公司秉持“客户至上,用心服务”的宗旨,从客户的利益和观点出发,让客户在网络营销中找到自己的驻足之地。尊重和关怀每一位客户,用严谨的态度对待客户,用专业的服务创造价值,成为客户值得信赖的朋友,为客户解除后顾之忧。

在react中,将某段代码封装成一个组件,而这个组件又在另一个组件中引入,那么引入该封装的组件的文件叫做父组件,被引入的组件就叫做子组件。

有时候我们经常分不清什么是父组件,什么又是子组件。现在来简单说下:我们将某段代码封装成一个组件,而这个组件又在另一个组件中引入,而引入该封装的组件的文件叫做父组件,被引入的组件叫做子组件。

react中直接调用子组件的方法(非props方式)

我们都知道在 react中,若要在父组件调用子组件的方法,通常我们会采用在父组件定义一个方法,作为props转给子组件,然后执行该方法,可以获取到子组件传回的参数以得到我们的目的。

显而易见,这个执行是需要去主动触发的。

那有没有一种方式,方法在子组件定义好,可以直接在父组件去调用呢?

答案是必然的。

上代码

import React, {Component} from "react";
import { Button } from "antd";
//父组件
export default class Parent extends Component {
    render() {
        return(
            
          

这是父组件

                                 click             
        )     }     bindRef = ref => { this.child = ref }     btnClick = () => {         this.child.getValuefromChild()     } } //子组件 class Child extends Component {     componentDidMount(){         this.props.triggerRef(this)     }   //这是子组件的方法     getValuefromChild = () => console.log("this is child value.")     render() {         return 
这是子组件
    } }

关于react中子组件是什么意思就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。


网站标题:react中子组件是什么意思-创新互联
文章源于:http://bzwzjz.com/article/djheoo.html

其他资讯

Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号
友情链接: 网站设计 app网站建设 成都网站建设 品牌网站建设 网站建设公司 网站制作 成都网站设计 手机网站制作 古蔺网站建设 成都模版网站建设 公司网站建设 成都网站建设公司 成都网站建设 H5网站制作 网站建设改版 重庆网站建设 成都网站设计 成都网站建设 高端网站设计 成都网站设计 成都定制网站建设 网站建设