ReactJS : this.props.children에서 부모의 setState()를 호출하는 방법은 무엇입니까?

Question

나는 비슷한 렌더링 기능의 반작용 라우터에 의해 사용되는 상위 구성 요소가 있습니다

render() { 
     return (
      <Grid> 
       <Breadcrumb> 
        {this.state.breadcrumbs} 
       </Breadcrumb> 
       {this.props.children} 
      </Grid> 
     ); 
    } 

그리고 아이들 중 하나가() 일부 JSON을 가져 오기 위해 시도합니다. 이 json에는 부모의 this.state.breadcrumbs을 업데이트하려고하는 몇 가지 추가 정보가 포함되지만이를 달성하는 방법을 모르겠습니다.

Answer 1

는 소품으로 부모의 상태를 변경합니다 기능을 통과 다음 ...

부모 구성 요소를

updateState(newState){ 
    this.setState({ 
    breadcrumbs: newState, 
    }) 
} 

render() { 
    var childrenwithProps = React.Children.map(this.props.children, function (child){ 
    return React.cloneElement(child, { 
     updateParentState: this.updateState 
    }) 
    }) 
     return (
      <Grid> 
       <Breadcrumb> 
        {this.state.breadcrumbs} 
       </Breadcrumb> 
       {childrenwithProps} 
      </Grid> 
     ); 
    } 

하위 구성 요소

fetch() 
.then() 
.then(function(data){ 
    this.props.updateParentState(data) 
}) 

시도 아이들에게. 자식에서 새 상태를 매개 변수로 사용하여 this.props.updateState 함수를 호출하십시오. 부모의 상태가 업데이트됩니다.

희망이 있습니다.