라이프사이클

Life Cycle

• props / state에서 re render 되지 않게 조절 할 수 있음
• CompenetWillReceiveProps
  • props를 새로 지정했을 때 바로 호출됨
  • state변경에는 반응x
  • props값에따라 stat변경을 원하면 setState를 이용해 state를 변경한다.
  • 다음이벤트로 가는것이 아니라 한번에 변경됨
• shouldComponentUpdate
  • props만 변경되어도
  • state만 변경되어도
  • props & state 둘다 변경되어도
  • newProps와 new State를 인자로 해서 호출
  • return type 이 boolean 임
    • ture 면 render
    • false 면 render가 호출 x
    • 디폴트는 true
• compoentWillUpdate
  • 컴포넌트 재 랜더링 되기 직전에 불림
  • 여기선 setState 같은건 쓰면 x
• componentDidUpdate
  • 컴포넌트가 재 랜더링을 마치면 불림
• component 언마운트 (componentWillUnmount)

16.3 이후에 바뀐 라이프사이클

constructor

compoentWillMount

=> getDerivedStateFromProps

render

componentDidMount

(update)

CompenetWillReceiveProps

=> getDerivedStateFromProps

shouldComponentUpdate

render

componentWillUpdate

=> getSnapshotBeforeUpdate

componentDidUpdate

(unmount)

componentWillUnmount

static 메서드로 지정해주어야한다.

static getDerivedStateFromProps (nextProps, prevState) {     ....
    return null; //리턴이 있어야한다. return에서 새로운 state를 넣어줘도 된다. 
//    return {
//        age: 390,
//    };                                        
}