React入門 練習問題 46:コンポーネントの統合:参照の受け渡し
親コンポーネントから子コンポーネント内の特定のDOM要素に対して参照(Ref)を渡したい場合に使用する関数として正しいものはどれか。
- React.forwardRef
- React.passRef
- React.useRef
- React.attachRef
- React.bindRef
正解と解説を見る
正解:React.forwardRef
親コンポーネントから子コンポーネント内のDOM要素へ参照(Ref)を渡すには、「React.forwardRef」を使用するのが正解です。
【正解の理由】
通常、Reactでは親から子へ「ref」という名前のpropを直接渡すことはできません。「React.forwardRef」で子コンポーネントをラップすることで、親から受け取ったrefを子コンポーネント内部の特定のDOM要素(inputタグなど)に転送(フォワード)できるようになります。
【不正解の理由】
• 「React.passRef」という関数はReactに存在しない
• 「React.useRef」はコンポーネント内部で参照を作成するためのフックであり、親から子へ転送する機能ではない
• 「React.attachRef」という関数はReactに存在しない
• 「React.bindRef」という関数はReactに存在しない