자식 배열 - 업데이트되지 않음

Question

이것은 모호한 질문이지만 가상 코드를 통해 시도해 보겠습니다. 내가 부모 개체의 자식 개체의 배열을 만드는 경우 : 나는 아이 컴퍼넌트 내 아이에 setState를 할 경우

class Parent extends React.Component { 
    constructor() { 
     this.state = {kids: [<Child/>,<Child/>]}; 
    } 
    render() { 
     return <div>{this.state.kids[0]}{this.state.kids[1]}</div> 
    } 
} 
class Child extends React.Component { 
... 
} 

을 그 부모의 아이 배열을 변경해야 /합니까? 내 생각에 그 배열 의 요소는입니다. 따라서 하위 요소를 변경하면 하위 요소를 변경해야합니다. 내 이해가 틀렸어?

Answer 1

부모를 트리거하는 하위 업데이트가 발생할 때 발생하는 특정 콜백이 없으면 부모는 해당 업데이트를받지 않습니다.

대부분의 React 개발자가 스마트하고 멍청한 구성 요소 패턴을 채택한 이유는 다음과 같습니다. 두 구성 요소 모두에서 관리되는 어린이 상태가 실제로는 없어야합니다. 부모 컴퍼넌트는, 그 아이에게 적용되는 임의의 종류의 변경을 처리해, 그 자체의 상태를 갱신하는 자식 컴퍼넌트에 소품으로서의 콜백 기능을 제공 할 필요가 있습니다. 상태가 갱신되면 (자), 필요한 부분을 각 아이 컴퍼넌트에 건네줍니다. 소품.

귀하의 목표는 구성 요소 전체에 확산되는 상태의 양을 최소화하고 상태를 하나의 구성 요소로 관리하고 나머지는 소품 만 수신하도록하는 것입니다. 이에 대한 훌륭한 기사는 다음과 같습니다. http://jaketrent.com/post/smart-dumb-components-react/