개발일기

React Hook 중에는 useEffect라는 Hook이 존재한다. useEffect란 리액트에서 기본적으로 제공해주는 함수로써, useEffect함수가 포함된 컴포넌트가 처음 마운트되거나 컴포넌트가 리렌더링 될 때, 또는 선언된 변수의 값이 변경되거나 redux store의 값이 변경될 때 실행할 구문들을 정의해놓은 함수이다. 0. useEffect import방법 import { useEffect } from 'react'; react가 설치되어있으면 추가적으로 설치할 것 없이 위와같이 파일 상단에 추가하면 useEffect를 손쉽게 사용할 수 있다. 1. useEffect의 기본 형태 useEffect(() => { ... // 실행할 내용들 }); useEffect의 기본 형태는 위와 같다. 위..

useEffect를 사용할 경우, 메모리 누수가 발생하였다면서 다음과 같은 에러문구가 콘솔창에 나오는 것을 종종 확인할 수 있다. Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function 이 경우는 useEffect를 사용했을 때, cleanup function을 반환하지 않았기 때문에 발생하는 오류이다. 다음과 같이 cleanup function을 추가하면 에러가 사라지는 ..