React Apollo：一个查询，多个参数 - 如何缓存？答案

【问题标题】：React Apollo: One query, multiple arguments - How to cache?React Apollo：一个查询，多个参数 - 如何缓存？
【发布时间】：2017-10-05 21:25:48
【问题描述】：

我对此感到困惑。

假设我目前有以下查询：

export const getPokemon = gql`
  query getPokemon($filters: AssetFilters) {
    pokemon(filters: $filters) {
      name,
      generation,
      exp
    }
  }`;

默认情况下不传入任何过滤器，因此返回所有内容。

现在，我想使用这样的过滤器重新获取：

this.props.refetch({
  filters: {
    generation: '3rd'
  }
});

上面似乎覆盖了原始查询的本地缓存！

我正在编写一个离线优先应用程序，我希望这些不同的过滤排列被单独缓存，而不是覆盖原始缓存。

我怎样才能克服这个缓存困难，让 Apollo 分别缓存这些带有不同参数的查询？

【问题讨论】：

您找到解决问题的方法了吗？我目前正面临一个非常相似的问题，我正在苦苦挣扎......
我确实做到了。我最终使用提供的过滤器从本地缓存中获取。基本上，apollo 不仅会存储您的查询，还会存储伴随查询的变量作为您的缓存键。这意味着您需要在加载数据时提供它们。
@dipole_moment 你能详细说明一下吗？即你能指点我一些文件吗？我不认为我在做任何特定于缓存的事情 - 只是默认逻辑，所以我试图了解我需要哪些额外的代码。

标签： reactjs apollo react-apollo apollo-client

【解决方案1】：

Apollo 根据调用时使用的参数分别缓存结果中的每个字段。如果你用不同的参数调用同一个字段两次，它将有两个缓存条目。

使用 Apollo Devtools，您可以查看缓存的确切内容。如果您确定使用不同参数调用查询会覆盖初始缓存内容，则应考虑在 Apollo Client GitHub 存储库上提交问题并进行复制。

【讨论】：