less than 1 minute read

useEffect

side effect Hook

side effect(데이터 로드, 구독 설정, React 컴포넌트의 DOM 수정 등) 수행 시 사용

JS 의 클로저를 이용하여 외부 변수에 접근

정리가 필요한/필요하지 않은 것으로 나뉨

렌더링 이후에 매번 수행됨 (수정 가능)

관심사 구분은 Multiple Effect 사용

두번째 인수에 배열 넣음으로써 최적화 (특정 값만 바뀌면 리렌더링)

  • 정리가 필요할 시

    함수 반환 시키면 정리 시 해당 함수 실행

    함수 반환 : 구독의 추가와 제거를 위한 로직 묶어둘 수 있음

    정리 시점 : 컴포넌트가 마우늩 해제되는 때에 실행됨