Question

- 首先为模棱两可的标题道歉。我遇到的问题我真的很困惑如何把标题。我愿意接受编辑。基本上，我正在使用react-redux，我有一个模态，我在其中更新数据库中的一些内容。在更新时，我希望所有reducer状态都默认并关闭模态。（这是直截了当的，因为我在更新时触发了一个将所有值设置为默认值的函数）但是，在更新时，我想关闭模式并在响应中显示更新或错误消息的toastr。 我已经为toastr设置了组件和操作。

问题是toastr不显示消息，因为在它与商店的常量操作匹配之前，模态的reducers已经设置为default。克服这个问题的最佳方法是什么？

Modal.jsx

//update 
   updateConfig() {
            this.props.updateConfigNode(node, latestConfigData); //update action
            this.closeModal(); 
        }
    closeModal() {
        this.props.status(false); //Close modal
        this.props.update(''); //Set update action status 'updated or error' to ''
      }

Toastr.jsx

    componentDidUpdate() {
     this.routerConfigNotification(this.props.config); //Getting from store
   }
    configNotify(config) {
        const message = checkForRouterConfigUpdateState(config);
    if(message) {
            this._addNotificationNormal(message.title, message.type, message.text);
          }
    }

的Utils

    export function checkForRouterConfigUpdateState(routerConfig) {

  let message = {};
  let messageText;

  switch (_.get(routerConfig, 'updateStatus')) {
case '_error':
      messageText = 'An error has been occurred while updating configuration';
      return message = {
        mode: 'normal',
        title: 'Error',
        type: 'info',
        status: _.get(routerConfig, 'updateStatus'),
        text: messageText
      };

    case '_updated':
      messageText = 'Successfully Updated';
      return message = {
        mode: 'normal',
        title: 'Updated',
        type: 'info',
        status: _.get(routerConfig, 'updateStatus'),
        text: messageText
      };
}
}

我已经尝试过其他生命周期更新方法，但我最接近解决此问题的方法是使用setTimeout函数，我知道这是一个hack，我很确定有办法解决这些异步问题。先感谢您。

Answer 1

this.props.updateConfigNode(node, latestConfigData)是承诺吗？如果是这样，您可以将closeModal放入then块中，这样只有在您的请求完成时才会调用它。

this.props.updateConfigNode(node, latestConfigData).then(() => {
  this.closeModal();
});

如何异步重置值redux

1 个答案: