ReactJS - 等待在componentDidMount

时间:2016-01-04 22:15:48

标签: javascript reactjs reactjs-flux

有问题的代码如下。我在UserActions内进行了异步componentDidMount调用,之后我立即查看此操作填充的UserStore内的用户信息。显然,我不能依赖UserStore.isLargeAccess()被定义。最好的约定是将代码放在回调中依赖于动作,还是我错过了一些更大的设计选择?

componentDidMount() {
    this.changeListener = this._onChange.bind(this);
    UserStore.addChangeListener(this.changeListener);
    OrganizationStore.addChangeListener(this.changeListener);

    // Fetch user info
    UserActions.get(AuthStore.username);

    // UserStore.isLargeAccess() is undefined here,
    // because the previous action has not finished.
    if (UserStore.isLargeAccess()) {
      OrganizationActions.getUsers(this.state.organization);
    }

    if (UserStore.isGlobalAccess()) {
      OrganizationActions.getOrganizations();
    }
  }

1 个答案:

答案 0 :(得分:1)

它应该如何工作(如果我理解你的流程):

  1. 您应该为每个商店注册不同的回调(否则您不知道哪个商店会发出事件)
  2. 你开始做一些异步工作。
  3. 当异步工作完成后,它会使用来自异步工作的一些数据发送操作
  4. 您的商店UserStore和OrganizationStore会侦听此操作,当他们收到这些操作时,他们会做一些工作并发出更改。
  5. 当它们发出变化时,它们会从您的组件调用回调。在每个回调中,您知道哪个商店调用它,因此您知道从哪个商店获取数据。