ReactHook - useEffect

useEffect 함수는 리액트 컴포넌트가 렌더링 될 때마다 특정 작업을 실행할 수 있도록 하는 Hook이다.

useEffect는 componenet가 moun 되었을 때, component가 unmount 되었을 때, component가 update 되었을 때, 특정 작업을 처리할 수 있다.

useEffect 사용법

기본형태

useEffect(function, deps)

• function: 수행하고자 하는 작업
• deps: 배열 형태이며, 배열 안에는 검사하고자 하는 특정 값 or 빈 배열

리액트에서 useEffect 불러오기

import React, {useEffect} from 'react';

컴포넌트가 화면에 가장 처음 렌더링 될 때 한 번만 실행하고 싶을 때는 deps 위치에 빈 배열을 넣는다.

useEffect(()=>{
console.log('렌더링 될 때 마다 실행된다.');
},[])

만약 배열을 생략한다며느 리렌더링 될 때마다 실행된다.

useEffect(()=>{
console.log('마운트 될 때만 실행된다.');
})

특정 state가 바뀔 때만 실행하고 싶을 때 ```javascript useEffect(()=>{ console.log('업데이트 될 때 실행된다.'); },[name]); ``` 특정값이 업데이트 될 때 실행하고 싶을 때는 deps위치의 배열 안에 검사하고 싶은 값을 넣어준다.(의존값이 있는 배열 -> dependency array라고도 한다.)