useRef 배열

useRef의 .current 를 잘 이용하면 편리하게 DOM에 접근하여 해당 input의 값을 다룰 수 있다.
내가 접근할 ref들은 일반 input과 textarea였기 때문에 다음과 같이 type을 설정해주었다.

type TextInputElementType = HTMLInputElement | HTMLTextAreaElement;

그리고 useRef를 current의 initial 값을 빈 배열[]로 선언해주고

const refs = useRef<null | TextInputElementType[]>([]);

아래와 같이 사용해야한다.
만약 컴포넌트가 함수형 컴포넌트라면 forwardRef 해주는 것도 잊지말자

<input ref={el => refs.current[2] = (el as TextInputElementType)}>

eslint 설정 때문에 as TextInputElementType으로 type assertion을 해주지 않으면 el가 unknown이라서 에러가 난다.

굿~
아니 근데 eslint 설치하고 파일 구성만 하면 계속 오류나서 지웠는데 왜 검사되는거지