(리액트) State 와 Lifecycle

ㅎㄱㅇ·2023년 11월 19일

React공부

목록 보기
6/18

State란

  • 리액트 컴포넌트의 변경 가능한 데이터
  • 사전에 미리 정의된 것이 아닌 개발자가 직접 정의해서 사용
  • 렌더링이나 데이터 흐름에 사용되는 값만 state에 포함시켜야함
    (state가 변경될 경우 컴포넌트가 재렌더링 되기 때문 -> 성능 저하)
  • javascript 객체

예시

constructor -> 생성자(모든 클래스 컴포넌트에 존재하며 클래스가 생성될 때 실행되는 함수)
this.state -> 현재 컴포넌트의 상태를 정의하는 부분

state 수정

  • states는 정의된 이후 직접 수정하면 안됨
  • setState를 사용해 수정해야 한다


Lifecycle

컴포넌트는 계속 존재하는 것이 아니라 시간의 흐름에 따라 생성, 업데이트 되다가 사라진다

  • mount : 컴포넌트의 생성자 실행, 컴포넌트의 상태 정의, 컴포넌트 렌더링
  • update : 컴포넌트의 상태, props 등이 변경, 재렌더링
  • ubmount : 상위 컴포넌트에서 현재 컴포넌트를 더이상 표시하지 않을 때 unmount된다

0개의 댓글