父组件

javascript">import {  Button } from 'antd';
import Child from './Child';
function Parent() {
    let childRef = null;
    const getData = () => {
        console.log(childRef.state.msg)
      }
    return (
        <div>
            <h1>我是父组件</h1>
            <Child ref={(r) => (childRef = r)}></Child>
            <Button onClick={getData}>获取</Button>
        </div>
       
    )
}
export default Parent

 父组件中绑定ref和class组件有所不同，通过ref={(r) => (childRef = r)}绑定

子组件 

javascript">import React from "react";

class child extends React.Component {
    constructor(props) {
        super(props);
        this.state = { msg: '我是子组件' };
    }
    render() {
        return (
            <h1>子组件</h1>
        )
    }
}
export default child;

 最终效果，点击按钮获取子组件的state