* * 기능 구성 요소를 업데이트 할 데이터가 변경되지 않았습니다 할 때 어떻게

Question

그래서 내가 루트 구성 요소 클래스를 기반으로하고 다음과 같이 상태를 유지하는 반응 응용 프로그램이 있습니다 dataA이 전달됩니다

this.state = { 
    dataA: { //stuff here}, 
    dataB: { //stuff here} 
} 

을 하위 기능 구성 요소 A로, 그리고 dataB이 하위 기능 구성 요소 B로 전달됩니다.

하지만 언제든지 this.setState({dataA: { new state A cotnent }})을 수행 할 때마다 해당 구성 요소 B의 데이터가 변경되지 않아도 업데이트됩니다.

구성 요소 B는 기능 구성 요소이므로 shouldComponentUpdate 메서드를 구현할 수 없습니다. 따라서 dataA 만 변경되었을 때 구성 요소 B를 렌더링하지 않는 방법이 있습니까? 감사!

Answer 1

기능 구성 요소는 값이 변경되지 않은 경우에도 항상 소품이나 주를 받으면 다시 렌더링되기 때문에 가능하지 않습니다.

대신 기능 구성 요소의 하위를 PureComponent의 하위 클래스로 변환하는 것이 좋습니다. 하위 클래스는 shouldComponentUpdate을 구현하여 하위 및 하위 비교 소품과 상태를 비교합니다. PureComponents의 모든 어린이는 PureComponents이어야하며 이러한 조건이 너무 제한적인 경우 shouldComponentUpdate을 Component의 하위 클래스에 직접 구현해야합니다.