이전 시간에 작업했던 내용을 토대로 오늘 작은 CRUD 프로젝트를 완료했다. 구현하면서 궁금하거나, 알아야했던 내용들은 어제 학습한 내용을 토대로 해결됐으며 덕분에 이후의 내용들을 만드는 데에 문제가 있진 않았다.
여기서는 간략하게 해당 프로젝트의 구현 내용 및 레포지토리를 기록하고, 오늘 작업하면서 발생한 문제 해결 한 가지를 간략하게 작성하고 마치고자 한다.
https://github.com/DrunkenNeoguri/ts-cra-redux-prac
1️⃣ useState의 setState의 함수 타입 선언
useState를 사용할 때, 초기값을 통해 state의 타입을 추론하여 정해지는 것을 학습을 하며 배웠으나, 경우에 따라서는 setState의 값을 하위 컴포넌트에 넘겨줘야하는 상황이 생길 수도 있다.
이 경우 이 props로 넘겨준 setState 함수의 타입을 정의해줘야 하는데, 이 타입을 어디서 가져와야할지 감이 잡히지 않을 때가 있다.
이때는 이전에 RootState의 타입 정의를 확인하려고 거슬러 올라가듯 해당 함수 또한 그런 방식으로 타입을 거슬러 올라가 확인하면 된다.
위와 같이 setState 함수에 마우스를 올리면 관련 정보를 볼 수 있는데 이렇게 타입의 정보를 알 수도 있으므로 이 방법을 적극 활용하여 타입 선언에 활용하자.
2️⃣ 타입 좁히기(type narrowing)를 통한 선택적 prop의 타입 에러 방지