Question

我有一个react组件，我想在redux中设置一些状态，当设置state时我想在组件中做一些其他的东西。

if ((!errorZip)||(zip!= 5)){
    $(".error_zip").show();
    errorZip = true;
    console.log('zip issue');
} else {
    $(".error_zip").hide();
    errorZip = false;
}

Answer 1

您不应该在另一个动作创建者中调度动作（在您的情况下为函数 updateDataInReduxState ）。动作创建者仅用于分派动作，而动作又由缩减器监听，状态也相应地改变。

你可以像这样处理你的案子。

//Inside component, dispatch updateData action without any callback
onButtnClick() {
    const currentTime = moment.tz('US/Eastern').valueOf();
    this.props.updateDataInReduxState(currentTime);
}

//Now listen to your prop updates and once current time prop is set in your state, dispatch your openInputModalToShowTime action
componentWillReceiveProps(nextProps) {
    if(nextProps.hasOwnProperty('currentTime') && nextProps.currentTime != null){
      this.props.openInputModalToShowTime();
    }
}

Answer 2

我没有专家，但似乎你只想在redux状态更新后显示一个模态。由于调度操作是同步的，因此您不需要回调来完成工作。我认为你的组件showModal中可以有一个本地状态（不是redux状态），它被初始化为false。然后，在onButtonClick()函数中，您将调度操作以更新redux状态，然后调用setState将本地状态showModal设置为true。在组件的渲染功能中，您有{this.state.showModal && <ModalComponent />}之类的东西。名称ModalComponent只是一个示例，它可能只是一个简单的<div>xxxx</div>。关闭模式时，请确保将状态重置为false。

将回调/承诺传递给组件中的动作创建者

2 个答案: