React js 라이프사이클

마운트
업데이트
마운트 해제

기능 구성요소

마운트:
useEffect(() => {...}, []): 빈 종속성 배열이 있는 useEffect 후크는 componentDidMount와 유사하게 초기 렌더링 후에 한 번만 실행됩니다.

업데이트:
useEffect(() => {...}, [종속성]): useEffect에 종속성을 전달하면 componentDidUpdate와 유사하게 종속성(상태 또는 소품) 중 하나가 변경될 때마다 실행됩니다.
useState(): 이 후크는 상태를 업데이트하여 다시 렌더링을 트리거합니다.
useMemo() 및 useCallback(): 이 후크는 값과 함수를 메모하여 업데이트 중 성능을 최적화하는 데 도움이 됩니다.

마운트 해제:
useEffect(() => {... return () => {...}}): useEffect에서 정리 함수를 반환하여 componentWillUnmount와 유사하게 구성 요소가 마운트 해제될 때 실행할 수 있습니다.

클래스 구성요소

마운트:
생성자()
구성 요소를 초기화하고 상태를 설정하며 메서드를 바인딩합니다.

getDrivedStateFromProps()
렌더링하기 전에 상태를 소품과 동기화합니다. 자주 사용되지는 않습니다.

렌더링()
렌더링할 내용(UI)을 설명하고 JSX를 반환합니다.

comComponentDidMount()
구성요소가 마운트된 후 호출됩니다(데이터를 가져오는 데 유용하며
설정). 구독을 늘리세요).

업데이트:
getDrivedStateFromProps()
렌더링하기 전에 상태를 소품과 동기화합니다(업데이트 중에도 호출됨).

shouldComponentUpdate()
재렌더링이 필요한지 결정합니다(성능 최적화에 사용)

렌더링()
상태나 소품이 변경되면 구성 요소를 다시 렌더링합니다.

getSnapshotBeforeUpdate()
DOM이 변경되기 전에 정보(예: 스크롤 위치)를 캡처합니다

컴포넌트DidUpdate()
구성요소가 다시 렌더링된 후 호출됩니다(
과 상호작용하는 데 유용함). DOM 또는 네트워크 요청).

마운트 해제:
컴포넌트WillUnmount()
구성요소가 DOM에서 제거되기 전에 호출됩니다(정리를 위해 사용됨,
구독 삭제 등)

오류 처리
comComponentDidCatch()
하위 구성 요소에서 오류를 포착하고 오류 처리를 허용합니다(React
16).

위 내용은 React js 라이프사이클의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!