react父组件调用子组件方法

react父组件调用子组件中的方法

//父组件
import React, { Component } from "react";
import Child from "子组件地址";

class Dad extends Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <div>
                <Child onRef={this.onRef}></Child>  //调用子组件
                <button onClick={this.click}>按钮</button>  //父调子的方法
            </div>
        )
    }
    onRef=(ref)=>{
        this.Child=ref;
    }
    click=()=>{
        this.Child.childFn();
    }
}
export default Dad;
--------------------------------------分割线----------------------------------------------------
//子组件
import React, { Component } from "react";

class Child extends Component {
    componentDidMount() {
        this.props.onRef(this)
    }
    render() {
        return (
           <div></div>
        )
    }
    childFn=()=>{
        console.log("子组件中的方法")
    }
}
export default Child;