React error 해결법: Type 'MutableRefObject<HTMLInputElement | undefined>' is not assignable to type 'LegacyRef<HTMLInputElement> | undefined'.

에러 발생

react 개발시 useRef 사용시 아래와 같은 에러가 발생할 때가 있다.

const componentRef = useRef();

Type 'MutableRefObject<HTMLInputElement | undefined>' is not assignable to type 'LegacyRef<HTMLInputElement> | undefined'.

 

원인

useRef 선언시에 null 을 제대로 선언해주지 않았다.

 

해결법

엘리먼트 객체와 null 을 추가하여 선언한다.

const componentRef = useRef<HTMLDivElement>(null);