본문 바로가기

> 개발/Typescript2

[Typescript] 'socialLoginImg'는 'undefined'일 수 있습니다. 로그인과 회원가입 화면을 구현할 때 공통 컴포넌트인 AuthInputForm.tsx를 활용했다. LoginData와 SignUpData에 따라 다른 레이아웃을 구현할 수 있도록 부모->AuthInputForm에 data를 넘겨주고 있다. 상황 로그인 컴포넌트에서는 AuthInputForm으로 LOGIN_DATA와 소셜 로그인 아이콘이 담긴 SOCIAL_IMG 배열 두 개를 넘긴다. 회원가입 컴포넌트에서는 SIGN_UP_DATA만 넘긴다. 그래서 AuthContainerProps의 인터페이스에서 socialLoginImg를 ? 로 선택적 프로퍼티가 되도록 설정했다. export interface AuthFormInputItem { id: number; title: string; type: string; n.. 2023. 4. 4.
[Typescript] Props가 여러 개일 때 타입스크립트 적용하기 프로젝트에 타입스크립트를 적용하기로 해서 타입스크립트 이론을 공부했다. 공부를 한 뒤 프로젝트에 적용하고 있는데 쉽지 않다. 다른 사람이 만든 타입스크립트 프로젝트를 보고 참고하려고 해도 나와 넘기려는 데이터 형태 또는 파일 구조가 달라서 참고할만한 예제 찾는 것도 어렵다. 이론 공부만으로는 정말 많이 부족하고 실전을 경험하면서 모르는 부분을 찾으면서 공부를 하는 게 개발 공부에서의 왕도라는 걸 새삼 또 깨닫는당! 개요 타입스크립트를 적용할 곳은 로그인 부분이다. LoginPresenter.tsx -> LoginContainer.tsx -> InputForm.tsx 방향으로 data와 socialLoginImg 를 props로 넘기고 있다. 참고로 loginInputForm 파일명을 회원가입과 로그인 .. 2023. 4. 3.