forwardRef
親Componentから子ComponentのDOMノードにアクセスしたい時に使う
カプセル化が壊れるので、普通はほぼ使わない
docs
例
code:ts
// 子
const FancyButton = React.forwardRef((props, ref) => (
<button ref={ref} className="FancyButton">
{props.children}
</button>
));
// 親.
const ref = React.createRef(); // 子のrefとして使用できる
<FancyButton ref={ref}>Click me!</FancyButton>;
react-hook-formでfieldをwrapしたComponentを作るときとかによく使うmrsekut.icon
https://numb86-tech.hatenablog.com/entry/2019/12/06/122217
useImperativeHandle
https://qiita.com/mori-dev@github/items/c7272975aaed017d96e7
https://chaika.hatenablog.com/entry/2019/05/09/120000
https://zenn.dev/misuken/articles/d503c45c92aa70
https://zenn.dev/takepepe/articles/atoms-ref-forwarding
Tailwind CSSなどを使うと多用する
https://zenn.dev/misuken/articles/d503c45c92aa70