[React]useRef() が使えない

*hooks以降のreact

Error内容

useRefを使ったときに
型 'MutableRefObject' を型 'LegacyRef | undefined' に割り当てることはできません
と出る。

const ref = useRef<HTMLElement>()
...

return (
    <>
        <div ref={ref}>
            ...
        </div>
    </>
)

解決法

useRefはnullで初期化する。また、型は詳しく書く！

const ref = useRef<HTMLDivElement>(null)

nullで初期化することによりMutableRefObjectになる。
MutableRefObjectはReactが管理するobjectであり、勝手にref.currentが変えられることを防ぐことができるとのこと！