Hello,

kok nae-ga ha-myun an-dweneun MAGIC...🧚

~ 2024.08

[React.js] LifeCycle

도담 🌱 2021. 8. 21. 16:35

노마드코더 개발자 분의 리액트 강좌를 듣다가 정리해놓으면

추후에 좋을 것 같아 오랜만에 끄적여 본다.

React Component의 Life Cycle에 관한 이야기다.

 

크게 어렵진 않았다 사실 vue랑 같아서...

크게 3가지 단계로 나뉘어진다 :)

1. Mounting

2. Updating

3. Unmounting

 

 

Mounting

@ constructor()
    - JavaScript에서 Class를 만들 때 호출
    - Coponent가 Mount될 때 || 화면에 표시 될 때 호출

@ render ()
@ componentDidMount()

    - Component가 처음 render될 때 호출

 

Updating : state를 변경할 때!

@ render()

@ compontnetDidUpdate()

 

Unmounting : Component가 죽을때 😔

@ componentWillUnmount

 

리액트에서 setState 함수 호출을 할 경우에 Component 호출 후 render() 함수를 실행한다!