参照を親コンポーネントにドリルする必要がある場合、入力が子コンポーネントのフォーカスを取得しているかどうかを確認するにはどうすればよいですか?

Question

入力にフォーカスがあるかどうかに基づいてスタイルを更新しようとしています。ここで useRef を使用できることはわかっていますが、inputRef は親コンポーネントで使用できるオプションの prop です。ここに示されているサブコンポーネントの入力がフォーカスされているかどうかを確認するにはどうすればよいですか?

リーリー

Answer 1

useEffect 内の現在の document.activeElement をチェックすることで、入力のフォーカス状態を評価できます。このような：＃＃＃ リーリー

その後、その状態を使用して親 div を動的にスタイル設定できます。