useState2 [React] Hooks란? 사용방법과 배경 정리 (useEffect, useState, Custom Hook) Hook Hook을 사용하여 기존 Class 바탕의 코드를 작성할 필요 없이, 상태 값 관리와 여러 React 기능을 사용할 수 있다. (v16.8 부터 추가됨) Hook이 만들어진 배경 기존 컴포넌트 사이에서 상태 로직 재사용이 어려웠다. React는 컴포넌트 간 재사용 가능한 로직을 붙이는 방법을 제공하지 않는다.(ex. 스토어에 연결) 따라서, render props나 HOC(고차 컴포넌트) 패턴으로 해결해 왔지만, 이런 패턴은 컴포넌트 재구성을 강요하며, 코드 추적을 어렵게 만든다. provicders, consumers, HOS, render props 그리고 다른 레이어로 둘러싸인 wrapper hell이 될 수 있다. 그래서 React는 상태 관련 로직 공유를 위한 좀 더 좋은 기초 요소가 .. 2023. 4. 21. Typescript에서 useState를 props로 넘기는 법 useState로 선언한 setValue를 컴포넌트에 props로 넘기고 싶은데 아래처럼 코드를 짜면 Typescript에서는 타입 경고가 뜬다! // ParentComponent.tsx const [value, setValue] = useState(true); // ... return ( ); // SomeComponent.tsx interface SomeComponentProps { setValue: () => void; } // ... 이 때 저 ParentComponent.tsx의 setValue에 마우스를 올리면 이런 친절한 가이드가 나오는데, 이대로 인터페이스 타입 세팅을 수정해주면 된다. // SomeComponent.tsx import { Dispatch, SetStateAction } f.. 2022. 11. 9. 이전 1 다음
