在this.props.relay.setVariables触发提取后加载指示器？

Question

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

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

我如何提供回调或其他东西来知道当前组件现在正在获取数据/现在已完成的获取数据？

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

我认为我不能为此使用react-router-relay，因为它只允许我显示一个加载指示符，而不是我的当前路由--但是我想在当前路由中显示加载指示符。

请帮帮忙。

Answer 1

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

还请参阅 docs和guide to ready states --基本上readyState是{aborted, ready, done, error, ...}的一个对象，您可以使用它来适当地更新UI：

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