[React] Satae and Lifecycle

Satae 

 - 리액트 Component의 상태(데이터)

   : 리액트 Component의 변경 가능한 데이터

 - 사용자가 Satae 정의

class LikeButton extends React.Component{ // LikeButton라는  React.Component를 나타냄
 constructor(props) { // 생성자 : 클래스가 생성 될 때 생성됨
  super(props); 
  
  this.state = { // 현재 컴퍼런스의 상태를 정의
   likes: flase;
  }
 
 };
}

// 수정
this.setState({
  name:'Inje'
});

 - 렌더링이나 데이터 흐름에 사용되는 값만 state에 포함시켜야 한다.

 - 자바스크립트 객체이다.

 - 직접 수정하면 안된다.

 

 

 Lifecycle

 - 리액트 Component의 생명주기

1)  Mounthing

     - 생성자 실행

     - Component state를 경의 하게 된다.

     - Component 렌더링 되며 이후에 ComponentDidMount 실행

2) Updating

   : 업데이트되는 과정 

    - Component의 props 변경

    - SetState 함수 호출에 의해 State 변경

    - forceUpdate(강제 업데이트) 함수 호출로 인해 콘퍼런스 강제 랜더링

    - ComponentDidUpdate

3) Unmounting

    : 상위 컴포넌트에서 현재 콘퍼런스를 더 이상 화면에 표시되지 않을 때 

    - ComponentWillUnmount