子組件

import {useState, useImperativeHandle,forwardRef} from 'react';
// props子組件中需要接受ref
let ChildComp = (props,ref) => {
    // 此處注意useImperativeHandle方法的的第一個參數(shù)是目標(biāo)元素的ref引用
    useImperativeHandle(ref, () => ({
        // changeVal 就是暴露給父組件的方法
        changeVal: (newVal) => {
           
        }
    }));
    return (
        <div>{val}</div>
    )
}
ChildComp = forwardRef(ChildComp)

父組件

import {useRef} from 'react';
const FComp = () => {
    const childRef = useRef();
    const updateChildState = () => {
        // changeVal就是子組件暴露給父組件的方法,99為給子組件傳遞的參數(shù)
        childRef.current.changeVal(99);
    }
    return (
        <>
            <ChildComp ref={childRef} />
            <button onClick={updateChildState}>觸發(fā)子組件方法</button>
        </>
    )
}