[React Native] 생명주기와 useEffect()

출처 : https://www.c-sharpcorner.com/article/components-lifecycle-in-react/

• Mounting
  • 가장 처음 실행되는 단계
  • constructor에서 모든 것이 이루어지며, state와 prop, component 등을 준비시킴
  • rendering
  • constructor에서는 http request와 같은 side effect를 실행시키지 말 것
  • 총 4가지 메서드
    • constructor()
    • static getDerivedStateFromProps()
    • render()
    • componentDidMount()
• Updating
  • state나 prop이 바뀌어 re-rendering이 필요할 때
  • 총 5가지 메서드
    • static getDerivedStateFromProps()
    • shouldComponentUpdate()
    • render()
    • getSnapshotBeforeUpdate()
    • componentDidUpdate()
• Unmounting
  • component가 DOM에서 삭제되는 단계
  • 단 1개 메서드
    • componentWillUmount()
• useEffect()
  • 컴포넌트가 렌더링 될 때마다 특정 작업을 실행할 수 있도록 하는 Hook
  • useEffect( FUNCTION, DEPS )
  • deps : 배열이며, 배열 안에 검사하고자 하는 특정 값 / 빈 배열
• useEffect 사용법
  • Component가 mount됐을 때 한 번만 실행
    deps에 빈 배열 넣기
  • re-rendering 될 때마다 실행
    deps 생략
  • Component가 update 될 때마다 실행
    deps에 검사할 값

 

 

 

https://www.c-sharpcorner.com/article/components-lifecycle-in-react/

Components Lifecycle In React

https://xiubindev.tistory.com/100

React Hooks : useEffect() 함수