React useEffect 정리

- 컴포넌트는 Lifecycle

• 생성(mount)
• 재렌더링 (update)
• 삭제(unmount)

 

- useEffect 정리

 

1. 재렌더링마다 코드를 실행

useEffect(()=>{ 실행할코드 })

 

 

2. 컴포넌트 mount시 (로드시) 1회만 실행

useEffect(()=>{ 실행할코드 }, [])

 

3. useEffect 안의 코드 실행 전에 항상 실행

useEffect(()=>{ 
  return ()=>{
    실행할코드
  }
})

 

4. 컴포넌트 unmount시 1회 실행

useEffect(()=>{ 
  return ()=>{
    실행할코드
  }
}, [])

 

5.test이 변경될 때만 실행

useEffect(()=>{ 
  실행할코드
}, [test])