Question

父组件：

{this.state.Child2 ? (
  <Child2 Colorvalue={this.state.activeColor} somename={this.state.name} />
) : (
  <Child1 somename={this.state.name} Colorvalue={this.state.activeColor} />
)}

在child1和amp; child2组件我添加了一个对actioncreator（api调用）的调用来获取一些信息 - 在ComponentWillMount方法中 - 一切正常......

this.props.fetchData(somename, Colorvalue);

现在我需要更新两个孩子，如果父级上的Colorvalue发生了变化..我应该使用新的'Colorvalue'调用actioncreator 我是否应该在两个子组件的更新/接收道具方法中进行另一次调用？如何处理这种情况。？

在每个子组件中，如果我这样做，将会有2次调用actionCreators吗？

Answer 1

您可以在父级中调用API调用this.props.fetchData(...)。然后在父级中更新this.state.activeColor。现在将该值作为道具传递给Child1或Child2。

在您的子组件中，由于您在ComponentWillMount中发送了该操作，因此当您从父级提供新道具时，将不会在其中发生新的API调用。

如果您想在收到新道具后更新子组件的内部状态（如果有），可以使用componentWillReceiveProps(nextProps)。

<强>更新

Child1和Child2通过道具从父级接收新颜色。因此，如果您想在接收新道具时触发API调用，请在子组件this.props.fetchData(...)内发送componentWillReceiveProps。

希望您使用的是ES6课程：

componentWillReceiveProps(nextProps) {
    if (this.props.Colorvalue !== nextProps.Colorvalue) {
        this.props.fetchData(this.props.somename, nextProps.Colorvalue);
    }
}

我也假设您已使用fetchData将动作创建者connect映射为子组件的道具。

调用动作创建者对状态/道具的改变

1 个答案:

<强>更新