-
마운팅: 이것은 React 구성 요소의 수명 주기에서 첫 번째 단계이며 구성 요소가 DOM에 처음 렌더링될 때 발생합니다. 이 단계에서 다음 메서드가 순서대로 호출됩니다.
- constructor(): 컴포넌트가 처음 생성될 때 호출되는 메소드입니다. 상태를 초기화하고 메서드를 바인딩하는 데 사용됩니다.
- 정적 getDerivedStateFromProps(): 이 메서드는 렌더링 직전에 호출되며 구성 요소가 소품의 변경 사항에 따라 내부 상태를 업데이트할 수 있도록 합니다.
- render(): 이 메서드는 DOM에 렌더링될 JSX를 반환합니다.
- componentDidMount(): 컴포넌트가 DOM에 마운트된 후 호출되는 메소드입니다. 이벤트 리스너를 설정하거나 서버에서 데이터를 가져오는 데 자주 사용됩니다.
-
업데이트: 이 단계는 구성 요소의 props 또는 상태가 변경될 때 발생하며 구성 요소를 다시 렌더링해야 합니다. 이 단계에서 다음 메서드가 순서대로 호출됩니다.
- static getDerivedStateFromProps(): 이 메서드는 props의 변경 사항에 따라 구성 요소의 상태를 업데이트하기 위해 다시 호출됩니다.
- shouldComponentUpdate(): 이 메서드를 사용하면 구성 요소가 다시 렌더링해야 하는지 여부를 결정할 수 있습니다. false를 반환하면 구성 요소는 이 단계에서 나머지 수명 주기 메서드를 건너뜁니다.
- render(): 이 메서드는 DOM에 렌더링될 업데이트된 JSX를 반환합니다.
- getSnapshotBeforeUpdate(): 이 메서드는 업데이트된 JSX가 DOM에 렌더링되기 직전에 호출됩니다. 구성 요소가 변경되기 전에 DOM에 대한 일부 정보를 캡처할 수 있습니다.
- componentDidUpdate(): 이 메서드는 업데이트된 JSX가 DOM에 렌더링된 후 호출됩니다. DOM의 변경 사항에 따라 구성 요소의 상태를 업데이트하는 데 자주 사용됩니다.
-
마운트 해제: 이 단계는 컴포넌트가 DOM에서 제거될 때 발생합니다. 이 단계에서 다음 메서드가 호출됩니다.
- componentWillUnmount(): 컴포넌트가 DOM에서 제거되기 직전에 호출되는 메소드입니다. 구성 요소가 만들었을 수 있는 이벤트 수신기 또는 기타 리소스를 정리하는 데 자주 사용됩니다.