十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
这篇文章将为大家详细讲解有关react中子组件是什么意思,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
成都创新互联专业为企业提供太平网站建设、太平做网站、太平网站设计、太平网站制作等企业网站建设、网页设计与制作、太平企业网站模板建站服务,10多年太平做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。
在react中,将某段代码封装成一个组件,而这个组件又在另一个组件中引入,那么引入该封装的组件的文件叫做父组件,被引入的组件就叫做子组件。
有时候我们经常分不清什么是父组件,什么又是子组件。现在来简单说下:我们将某段代码封装成一个组件,而这个组件又在另一个组件中引入,而引入该封装的组件的文件叫做父组件,被引入的组件叫做子组件。
react中直接调用子组件的方法(非props方式)
我们都知道在 react中,若要在父组件调用子组件的方法,通常我们会采用在父组件定义一个方法,作为props转给子组件,然后执行该方法,可以获取到子组件传回的参数以得到我们的目的。
显而易见,这个执行是需要去主动触发的。
那有没有一种方式,方法在子组件定义好,可以直接在父组件去调用呢?
答案是必然的。
上代码
import React, {Component} from "react"; import { Button } from "antd"; //父组件 export default class Parent extends Component { render() { return() } 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中子组件是什么意思就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。