在this.props.relay.setVariables触发fetch之后加载指标?

时间:2016-02-18 02:44:38

标签: reactjs relayjs graphql-js

我使用react-router-relay,在我的一条路线中,我有一个下拉列表。

现在我从该下拉列表中选择一个不同的值 - 将调用this.props.relay.setVariables,它将根据此变量获取一些数据。此数据将显示在当前路径的图表组件中。

如何提供回调或某些东西,以便知道当前组件现在正在获取数据/现在获取数据?

我需要这个能够在图表组件的顶部显示加载指示器。

我认为我不能使用react-router-relay,因为它只能让我显示加载指示符而不是当前路线 - 但我想在当前路线中显示加载指示符。 / p>

请帮忙。

1 个答案:

答案 0 :(得分:11)

setVariables方法接受第二个参数onReadyStateChange回调,该参数可用于检测请求何时挂起以及何时完成或失败。

另请参阅setVariables docsguide to ready states - 基本上readyState{aborted, ready, done, error, ...}的对象,您可以使用它来更新适当的用户界面:

  this.props.relay.setVariables({...}, readyState => {
    if (readyState.done || readyState.aborted) {
      this.setState({loading: false});
    } else if (readyState.error) {
      this.setState({loading: false, error});
    }
  });