[react] Component Life Cycle

Life Cycle method

• 리액트가 컴포넌트를 생상하고 없애는 방법

mounting

• 컴포넌트가 태어나는 것 (렌더링이 다되면 호출됨 1번만 호출)

• 호출 순서
  constructor -> render -> ref -> componentDidMount

• 주로 비동기 요청을 많이 한다.
  예) setInterval로 함수 실행

Updating

• state를 변경할 때 (setState를 호출 할 때)
• 호출 순서
  setState -> shouldComponentUpdate -> render -> componentDidUpdate
  (setState 후 렌더링이 끝나면 실행)
• state값이 바뀔때 마다 실행되기 때문에 조건문을 걸어줘서 조건에 맞게 실행되도록 하자

Unmounting

• 컴포넌트가 떠날 때 실행 (다른 페이지로 갈 때, 컴포넌트를 교체할 때)
• 부모가 자식 컴포넌트를 없앨 때
  componentWillUnmount
• 주로 비동기 요청 정리할때 많이 사용
  예) clearInterval
  Interval을 정리 안해주면 컴포넌트가 사라져도 계속 실행되기 때문에 컴포넌트가 사라질 때 같이 없애준다.

참고문서