如何更新另一个组件状态?

时间:2017-01-23 10:02:10

标签: react-native redux state react-redux react-native-router-flux

我的应用编辑器包含以下几个组件:

  • 按钮
  • 克罗珀

以上所有组件都是编辑页面的子项。所以,我需要做的是从按钮组件更新裁剪器缩放状态。直接在UI组件上使用状态时我没有问题,因为我在这种情况下使用 redux 。但是当我只需要更新按钮状态时,我就会挣扎。

以下是我如何在Buttons组件中更改状态:

this.setState({
            zoom: this.state.minZoom,
            left: 0,
            top: 0,
        });

如何从Cropper组件调用上面的代码?

1 个答案:

答案 0 :(得分:0)

乔是对的。将其存储在编辑状态或redux存储中。

如果您想将其存储在编辑状态中。

您可以在编辑

的Cropper组件中将调用作为道具传递
<Cropper
  onChange={(minZoom) => {
     this.setState({
        zoom: minZoom,
        left: 0,
        top: 0,
     })
  }}
/>
<Button zoom={this.state.zoom} />

然后你可以像这样在

中的Cropper组件中调用它
this.props.onChange(this.state.minZoom);