2016-07-11 4 views
0

그래서 각 응용 프로그램에 서로 다른 데이터 집합을 포함하는 Stage이 있습니다.부모의 setState 후 Rerender 자식

무언가를 바꾸려면 내 자식 구성 요소가 스테이지의 데이터로 새로 고침을해야합니다.

enter image description here

나는 나의 App.jsx 구성 요소, 모든 페이지의 상단에이 단계의 선택이있다. 이 단계가 돌아 오는

내 차에 이제
.... 
changeStage: function (stageId) { 
    this.props.setStage(this.getStageById(stageId)); 
}, 
.... 
var mapDispatchToProps = function (dispatch) { 
return { 
     setStage: function (data) { dispatch(stageService.setStage(data)); } 
    } 
}; 
module.exports = ReactRedux.connect(mapStateToProps, mapDispatchToProps)(App); 

을 통해 국가에 의해 처리됩니다 (아이 -하지만 아래로 깊이) 구성 요소가 나는 다음과 같은 한 :

shouldComponentUpdate: function (nextprops, nextstate) { 
    console.log("stage id in this component: " + this.state.stageId); 
    console.log("stage id in nextstate: " + nextstate.stageId); 
    console.log("stage id from the redux store: "+ this.props.stage.id) 

    return true; 
}, 
.... 
var mapStateToProps = function (state) { 
    return { 
     stage: state.stage 
    }; 
} 

하지만 nextstate을 업데이트 단계를 포함하지 않고 오히려 앞 단계에서 말이됩니다. state.stageId도 이전 내용을 포함합니다. 하지만 this.props.stage.id을 새로 추가 한을 포함 할 것으로 예상되지만 그렇지 않습니다.

실제로는 이전 단계가 포함되어 있으므로 상태가 업데이트되거나 상태를 업데이트하기 전에 호출됩니다.

어쨌든 내 질문은, 어떻게 새 단계 단계를 선택할 수 있습니까? 무대 객체를 모든 자식에게 전달하고 싶지 않습니다. 왜냐하면 그것이 더 이상 읽을 수 없게 만들고 내 생각에 엉망이되기 때문입니다. 누구든지 어떤 아이디어가 있습니까?

+2

현재 this.props.stage.id 대신 nextprops.stage.id로 시도 했습니까? –

+0

그게 작동 했어, 내가 대답 할 수 있도록 대답으로 게시하십시오. 고맙습니다. – Tikkes

답변

0

당신은 단순히 구성 요소에 전달 된 nextprops를 얻을 수 this.props.stage.id 대신 nextprops.stage.id 사용해야합니다.

관련 문제