【react】親コンポーネントがサブコンポーネントを呼び出す方法

972 ワード

方法:
親コンポーネントuseRefを使用して、ref入力子コンポーネントを作成
...
const childrenRef = useRef(null);
...
return 

サブコンポーネントは、useImperativeHandleを使用してrefカスタムインスタンス値を親コンポーネントに暴露する必要がある.これはforwardRefで包む必要があります.
function children(props, ref) {
    useImperativeHandle(ref, () => ({
        hello: () => console.log('hello world!')
    }))
    return 

children

} export default forwardRef(children);

では、親コンポーネントではどのように呼び出されますか?
...
const childrenRef = useRef(null);
const something = () => childrenRef.current.hello();
...

推奨事項:
実装方法のキーを確認することもできます:useRefuseImperativeHandleforwardRef.実はrefの不変の性質を利用して、サブコンポーネントの方法を保存して、親コンポーネントは呼び出すことができます.refは、親アセンブリと子アセンブリの親アセンブリから子アセンブリへの橋渡し(一方向、親->子)として機能すると言える.