7. Component LifeCycle

총 열가지의 LifeCycle 메서드 존재
Will 접두사 - 작업 전 동작
Did 접두사 - 작업 후 동작

LifeCycle
- Mount, Update, UnMount로 분류

Mount
- Dom 생성 의한 웹브라우저 상 컴포넌트 활성화

Mount Call Method
constructor - 컴포넌트를 만들시 호출되는 클래스 생성자
getDerivedStateFromProps - props 값을 state 동기화 메서드
Ex)
static getDerivedStateFromProps(nextProps, prevState){
if(nextProps.value!==prevState.value){
return {value:nextProps.value};
}
return null
}
render - UI 렌더링 함수
componentDidMount - 컴포넌트가 웹브라우저 상 활성화 후 호출 메서드

Update
- porps,state 변경
- component 리렌더링
- this.forceUpdate 강제 렌더링 트리거
getDerivedStateFromProps - props 변경 시 호출
shouldComponentUpdate - 컴포넌트 리렌더링 여부 결정, state 변경 시점
Ex)
shouldComponentUpdate(nextProps, prevState)
메서드 생성하지 않으면 항상 true
render - 컴포넌트 리렌더링
getSnapshotBeforeUpdate - 변화된 내용을 DOM 반영 전 호출
Ex)
getSnapshotBeforeUpdate(prevProps, prevState)
이전 속성과 현재 상태의 속성 데이터 비교하여 처리 가능
componentDidUpdate - 컴포넌트 업데이트 끝난 후 호출
Ex)
componentDidUpdate(prevProps, prevState, snapShot)
전,후 컴포넌트의 데이터 접근 가능. 반환값이 있다면 snapShot에서 확인 가능

UnMount
- 컴포넌트를 DOM에서 제거
componentWillUnmount - 웹브라우저에서 컴포넌트가 사라지기 전 호출