reactjs - 如何从 React 中的 Apollo 订阅组件刷新查询/缓存

Question

想象一下这样的组件层次结构：

<Team>
  <Leaderboard />
  <PlayerStats />
</Team>

在 Leaderboard 的 render 方法中，我们有一个 Apollo/GraphQL Query 组件来获取顶级玩家。

我们还有一个组件，它在获得新的 PlayerStat 时触发（目前在 PlayerStats 中——但很高兴将它放在任何地方）。

如何在来自 PlayerStat 订阅组件的触发器时获取排行榜查询以重新获取查询/清除缓存。

谢谢！！

标签： reactjsgraphqlapolloreact-apolloapollo-client

Answer 1

所以 Apollo Query 组件提供了一个refetch带有 React 上下文的函数，就像data,loading和error。

<Query query={...} >
  {
    ({ data, loading, error, refetch}) => {
      if (!this.state.refetch) {
        this.setState({ refetch });
      }
      return <RenderData data={data} />;
    }
  }
</Query>

您可以在状态中设置此refetch函数，并在组件收到事件时调用它。