<리액트의 컴포넌트 LifeCycle>
- 이 싸이클을 알아야 컴포넌트를 만들 때 효율적으로 만들 수 있다.
Render 싸이클: componentWillMount( ) -> render( ) -> componentDidMount( )
- willMount : 사이클이 시작되었음을 확인
- render: 컴포넌트가 리액트 세계에 '존재'하게 되었음을 확인
- didMount : 성공적으로 리액트 세계에 컴포넌트가 자리잡았음을 확인
ex) 영화앱을 만든다고 치면,
will Mount 에서 api에 작업을 요청
render 에서 데이터 관련 작업 등...
각 단계에 맞는 작업을 작성하여 효율적으로 처리한다.
Update 싸이클 : componentWillReceiveProps( ) -> shouldComponentUpdate( ) -> componentWillUpdate( ) -> render( ) -> componentDidUpdate( )
- componentWillReceiveProps : 컴포넌트가 새로운 props를 받았다는 뜻
- shouldComponentUpdate : old props, new props를 살펴보고 old와 new가 다르면 '업데이트=true'로 업데이트가 발생하도록 함
- componentWillUpdate : 업데이트를 직접적으로 하는 단계
- render : 렌더링 작업
- componentDidUpdate: 업데이트가 완료되었음을 확인
ex) component will update 를 수행할 때, 어플리케이션에 '뱅글뱅글 돌아가는 spiner'를 붙혀서, 업데이트중임을 표시할 수 있고,
업데이트 이 후에는(componentDidUpdate), 돌고있던 spinner를 숨기면 됨
'개발 > 기타' 카테고리의 다른 글
| [Windows] 윈도우에서 텔넷(telnet) 명령어 활성화 하기 (0) | 2023.02.09 |
|---|---|
| [온라인 결제] 인증 / 비인증 결제 (0) | 2021.07.30 |
| 윈도우10 에서 React js (create-react-app 도구) 설치하기 (0) | 2018.10.05 |
| [기타] 모바일 웹 / 웹 앱 / 하이브리드 앱 / 네이티브 앱 개념 (0) | 2018.05.24 |