react life-cycle

·2021년 12월 18일
0

react

목록 보기
14/24
post-thumbnail

Mount

constructor (props)

기존 classconstructor 와 사용법 동일.

getDerivedStateFromProps (nextProps, prevState)

받아온 propsstate 를 동기화 시키는 경우 사용함.

componentDidMount ()

마운트 완료 후 호출하는 함수.
Ex) 외부 라이브러리 가져오기.




Update

shouldComponentUpdate (nextProps, prevState)

true 또는 false 로 반환.
값의 변경은 원하지만, 이를 렌더링하고 싶지 않을 때 사용.
true : update 값을 렌더링.
false : update 값을 렌더링 하지 않음.

getSnapshotBeforeUpdate ()

컴포넌트가 업데이트 되서 DOM 에 반영되기 직전에 호출하는 함수
업데이트가 되기전 DOM 상태를 변화를 주고 싶을때 사용.
이후 리턴된 정보를 componentDidUpdate() 로 가져올 수 있음.

componentDidUpdate (prevProps, prevState, snapshot)

컴포넌트가 업데이트 완료 된 후 호츨하는 함수.




UnMount

componentWillUnmount ()

컴포넌트가 없앨 때, 사라질 때 호출하는 함수.
Ex) 외부 라이브러리 없애기.




그외

componentDidCatch (error, info)

컴포넌트 오류로 앱이 크래쉬 되는 경우,
에러를 제어하기 위해 호출하는 함수.
해당 함수를 호출할 때는 에러가 난 컴포넌트의 부모 컴포넌트에서 호출할 것!
error : 해당 에러 표시,
info : 해당 에러가 난 컴포넌트 표시

profile
새로운 것에 관심이 많고, 프로젝트 설계 및 최적화를 좋아합니다.

0개의 댓글