[React] 리액트 훅 useEffect

 

useEffect란?

 

렌더링되거나 변수의 값 또는 오브젝트가 달라지게 되면, 그것을 인지하고 업데이트를 해주는 함수.

 

 

페이지가 처음 렌더링되고 난 후 무조건 한번 실행된다.

useEffect에 배열로 지정한 useState값(Dependency)이 변경되면 실행된다.

 

useEffect(effect, [, deps]);

 

-effect 함수

렌더링 이후 실행할 함수

 

-deps

특정한 값이 변경될 때 effect함수를 실행하고 싶을 경우 배열안에 그 값을 넣어준다.

빈 배열일 경우 렌더링된 후 단 한번만 실행된다. 

 

 

useEffect(() => {}); // 1

useEffect(() => {}, []); // 2

useEFfect(() => {}, [특정 변수 또는 오브젝트]); // 3

 

 

1. Dependency가 없기 때문에 어떤 useState의 변수든 값이 변경된 것을 인지하고 실행된다.

2. 렌더링 된 후 단 한번만 실행된다.

3. 렌더링 후 한번, 배열 안 변수의 값이 변했을 때만 실행된다. 

 

 

 

 

 

 

 

https://ko.reactjs.org/docs/hooks-effect.html

https://ko-de-dev-green.tistory.com/18

https://tocomo.tistory.com/32