javascript - componentWillReceiveProps包含多个if

我在React开发上还很新，但是我已经使用React + Redux进行了3个大型项目，我看到了一个我非常不喜欢的模式：

componentWillReceiveProps(nextProps) {
    if (nextProps.params.type === TYPE_NEW_USER) {
      this.modalUsername = this.props.showPopup( < NewUsernamePopup onClose = {::this.closeUsernamePopup
        }
        />, USERNAME_POPUP_ID, true);
      }
      if (this.state.kind !== nextProps.kind || this.state.filter !== nextProps.filter || this.state.hashtags !== nextProps.hashtags) {
        this.setState({
          results: [],
          loading: true,
          kind: nextProps.kind,
          filter: nextProps.filter,
          hashtags: nextProps.hashtags
        }, () => this.manageResults(nextProps.results, false));
      } else {
        this.manageResults(nextProps.results, true);
      }
      this.managePages(nextProps.paging);
}

我想避免componentWillReceiveProps内部的ifs。您如何处理？我们已经分析了另一个使用Flux和回调注册的项目。看起来像：

componentWillMount() {
  EntityStore.on(EntityActions.ENTITIES_LOADED, this.getData.bind(this));
  EntityActions.entitiesLoaded();
}

组件会发出第一个事件，但此后商店将发出事件，组件将进行更新。此外，单个存储将保持其状态，并且如果已有内容，则不会重复异步调用。我个人喜欢避免ifs，但是我不想失去Redux（它的社区和工具）。

您如何在组件外部的componentWillReceiveProps内部添加当前逻辑（if）？我想在服务层而不是组件内部处理逻辑。

我很高兴阅读您对此的看法，因为我一直在努力寻找合适的解决方案。

最佳答案

还原方法是将逻辑放入动作/归约器中。

所以我不知道您的manageResults方法是做什么的，但这可能是您要转移到reducer中的逻辑部分，因此您不再需要从组件中调用它。

因此，只能从redux操作更新kind，filter和hashtags变量。