首页 > 其他 > 详细

react 父组件获取子组件,调用子组件的方法

时间:2021-03-13 00:14:37      阅读:34      评论:0      收藏:0      [点我收藏+]

父组件

import React from ‘react‘;
import Tabs from ‘./tabs‘;

export default class FruitsList extends React.Component {

    child() {
        this.child.Alert(value)
    }

    // 子组件调用父组件的 setChild 方法,传入this( this就是子组件 )
    setChild = (that) => {
        this.child = that;
    }

    render() {
        return (<div>
            <Tabs setChild={this.setChild}></Tabs>
            <button onClick={()=>{ this.child() }}><button/>
        </div>);
    }
}

  子组件

import React from ‘react‘;

export default class Tabs extends React.Component {

    Alert() {
    alert("子组件的Alert方法调用") }
   
   //组件完成挂载调用父组件传过来的 setChildren(this) 这里的this 指向 Tabs 组件
    componentDidMount() {
            this.props.setChild(this);
       }
    render() {
        return (<div>
      我是子组件 </div>); } }

  

 

react 父组件获取子组件,调用子组件的方法

原文:https://www.cnblogs.com/liangziaha/p/14526819.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!