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

Question

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

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

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

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

我想我不能用react-router-relay它,因为它只能让我显示一个加载指示器而不是我当前的路线 - 但我想在当前路线中显示加载指示器.

请帮忙.

Answer 1

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

又见setVariables文档和指导就绪状态 -基本上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});
    }
  });