[React] useEffect란


반응 중 ‘useEffect’~이다 구성 요소가 렌더링되거나 특정 값이 업데이트될 때 실행할 함수를 설정할 수 있는 후크 보지마.

이 후크를 사용하여 기능 구성 요소에 “부작용”을 추가할 수도 있습니다.

부작용은 구성 요소 외부에 영향을 주는 작업입니다.

예를 들어 API 호출, 데이터 구독, 타이머 이들은 부작용의 예입니다.

이러한 작업은 일반적으로 렌더링 후에 발생하므로 useEffect 후크를 사용하여 구성 요소가 렌더링된 후에 실행되도록 설정할 수 있습니다.

useEffect 후크 두 개의 인수받다.

첫 번째 인수~이다 부작용 실행을 위한 함수자아,

두 번째 인수~이다 배열 형식의 종속성 배열보지마.

useEffect 후크가 호출되면 첫 번째 인수로 전달된 부작용 함수가 먼저 실행됩니다.

이 함수는 useEffect 후크가 마운트될 때 한 번 실행된 다음 구성 요소가 업데이트될 때마다 실행됩니다.

두 번째 인수로 종속성 배열을 전달할 수 있습니다.

이 배열 후크 실행 조건통제용이다

종속성 배열의 값이 변경될 때마다 후크가 실행됩니다.

빈 배열 전달(())useEffect 후크는 구성 요소입니다.

초기 설치 시에만 실행것이 가능하다.

다음 예제와 함께 useEffect 후크를 사용하는 방법을 살펴보겠습니다.


위의 예에서는 useEffect 후크를 사용하여 구성 요소의 제목을 업데이트합니다.

useEffect 후크의 두 번째 인수는 ‘count’입니다.

‘count’의 값이 변경될 때마다 부작용 함수가 실행됩니다.

여기서 두 번째 인수가 ‘(count)’가 아닌 빈 배열(())인 경우 부작용 함수는 구성 요소가 처음으로 마운트될 때만 실행됩니다.