reat.js父组建与子组建的方法的相互调用

// 爸爸
import React, {Component} from 'react';
class Dad extends Component {
    constructor(props) {
        super(props);
        this.state = {
        }
    }
    componentDidMount() {

    }
    
    callDad = (e) => {
        console.log('儿子呼叫爸爸');
    }

    callSon = (e) => {
        this.Son.onShow()
    }
    render() {
        return (
            <section>
                <Child onCancel={this.callDad} onRef={(ref)=>{ this.Son= ref}}></Child>
                <div onClick={this.callSon}>呼叫儿砸</div>
            </section>
        );
    }
}

export default Dad;



// 儿子
import React, {Component} from 'react';
class Son extends Component {
    constructor(props) {
        super(props);
        this.state = {
        }
    }

    componentDidMount() {
        this.props.onRef(this)
    }
    
    onShow(){
        console.log('儿子被爸爸呼叫');
    }

    render() {
        return (
            <section>
                <div onClick={()=>{this.props.onCancel()}}>呼叫爸爸</div>
            </section>
        );
    }
}

export default Son;