react life Cycle

Posted on Edited on In ,

react life cycle

get 또는 post로 데이터를 주고 받는 테스트를 하는 도중 너무 많은 에러가 있어
다시 한번 라이프 사이클을 정리하고 비동기를 어디에서 써야할지 변수 선언은 어디서 할지 한번 더 확인하는 겸 글을 정리해보려고 한다. 특히 hook의 useEffect가 이해가 아직 잘 안되서..
💀

-
리액트가 웹 상에 렌더링 되기 위해선 render() 메서드가 실행되어야한다
배운바에 의하면 리엑트는 순서가 정의되어있고 그 순서가 맞지 않으면 실행되지 않는다

  1. Mounting 단계

    컴포넌트가 시작되면(생성자) 우선 context, defaultProps와 state를 저장하는 단계입니다.
  2. componentWillMount

    DOM접근 금지 단계 render하기 전이라서 여러가지 변수 설정이나 변환하기 어려운 단계이다
  3. componentDidMount

    DOM에 접근할 수 있습니다. 그래서 여기에서는 주로 AJAX 요청을 하거나, setTimeout, setInterval같은 비동기 처리가 가능해진다.

-

리액트의 컴포넌트는 생성된 후 Mount 상태에서 한 번 render() 메서드를 실행하고, 후에는 Update 상태에 진입해 shouldComponentUpdate의 값이 true일 때만 render() 메서드를 실행한다

아직 단계를 배우는 중이라서 모르는 부분이나 괜찮은 예시가 있다면 추가할 예정이다