在父母的setState

Question

所以我的应用程序中有一个Stage，其中包含不同的数据集。

我想要做的是如果我改变我的舞台，我的孩子组件会刷新所述舞台的数据。

我在App.jsx组件的每个页面顶部都有这个阶段选择。 这个阶段由国家通过Redux处理

....
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我希望包含新选定的阶段，但事实并非如此。

它实际上包含之前的阶段，这意味着在状态更新或正在更新状态之前调用它。

所以无论如何我的问题是，如何选择 new 阶段？ 我不想把舞台上的对象传递给我所有的孩子，因为这会使它不再可读，而且在我看来会很草率。 有人有任何想法吗？

Answer 1

您只需使用nextprops.stage.id而不是this.props.stage.id来获取传递给组件的nextprop。