Question

我有一个ReactJS组件需要AJAX请求的响应才能呈现。我试图向商店添加一个监听器，这样当它发出loaded时，我会在组件上调用this.setProps(/*props*/)。这不起作用，因为组件的子节点也依赖于正在加载的数据。

我也尝试过使用componentWillUpdate和componentWillReceiveProps。我假设componentWillReceiveProps是我正在寻找的东西，它确实适用于它自己的主视图，但它不会将数据传播给孩子们。

有什么想法吗？

Answer 1

问题解决了

var Account = React.createClass({

  /**
   * @cfg {String}
   */
  displayName: 'Account',

  /**
   * Get initial state of component
   */
  getInitialState: function() {
    return { user: null, accounts: null };
  },

  /**
   * Set state of component when UserStore is loaded
   */
  onUserStoreLoaded: function() {
    this.setState({
      user: UserStore.getUser(),
      accounts: UserStore.getUserAccounts() 
    });
  },

  /**
   * Perform logic when component is about to mount to
   * the DOM
   */
  componentWillMount: function() {
    if (UserStore._user) {
      this.onUserStoreLoaded();
    } else {
      UserStore.on('loaded', this.onUserStoreLoaded);
    }
  },

  render: function() {
    return (
      <div className="col-sm-6 col-sm-offset-3">
        <h1 className="text-center"> Account </h1>
        <ConnectedAccounts accounts={this.state.accounts} />
      </div>
    );
  }

});

在AJAX之后加载React组件

1 个答案: