>웹 프론트엔드 >JS 튜토리얼 >React는 `setState()` 호출마다 구성 요소를 다시 렌더링합니까?

React는 `setState()` 호출마다 구성 요소를 다시 렌더링합니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-11-29 00:20:11551검색

Does React Re-render Components After Every `setState()` Call?

ReactJS: "setState" 호출 후 React 렌더링

쿼리: "setState"를 사용하여 React 다시 렌더링

React가 모든 구성 요소를 다시 렌더링합니까? "setState()"가 있을 때마다 해당 하위 구성요소 호출되었나요?

설명:

예, React는 기본적으로 "setState()"가 호출된 후 다시 렌더링을 트리거합니다.

기본 동작 이유:

React는 렌더링 최적화를 목표로 하지만 다음과 같은 경우 항상 "render" 메서드를 다시 실행하여 상태 변화로 인한 미묘한 버그를 방지합니다. 상태가 변경됩니다.

ShouldComponentUpdate 메서드:

각 구성 요소에는 "shouldComponentUpdate(nextProps, nextState)"라는 메서드가 있습니다. 이 메소드는 소품 및 상태 변경에 따라 "렌더링"을 다시 실행할지 여부를 결정합니다.

ShouldComponentUpdate의 기본 구현:

기본적으로 "shouldComponentUpdate"는 true를 반환하여 재렌더링이 발생하도록 합니다. 상태나 소품이 바뀔 때마다.

예:

제공된 코드에서 코드 조각에서 메인 구성 요소는 텍스트를 클릭할 때마다 상태를 동일한 값('me')으로 설정합니다. 상태가 변경되지 않더라도 React는 기본적으로 "shouldComponentUpdate"가 true를 반환하기 때문에 Main 및 TimeInChild 구성 요소를 모두 다시 렌더링합니다.

사용자 정의 ShouldComponentUpdate 구현:

다음을 통해 렌더링을 최적화할 수 있습니다. 실제 재렌더링이 필요한지 결정하기 위해 이전 소품과 새 소품 및 상태를 비교하는 "shouldComponentUpdate"의 사용자 정의 구현을 작성합니다.

위 내용은 React는 `setState()` 호출마다 구성 요소를 다시 렌더링합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.