React Apollo:一个查询,多个参数 - 如何缓存?

dip*_*ent 6 apollo reactjs react-apollo apollo-client

我很困惑.

假设我目前有以下查询:

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

默认情况下,不传递任何过滤器,因此返回所有内容.

现在,我想用过滤器重新获取:

this.props.refetch({
  filters: {
    generation: '3rd'
  }
});
Run Code Online (Sandbox Code Playgroud)

以上似乎覆盖了原始查询的本地缓存!

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

我如何克服这个缓存难题并让Apollo分别用不同的参数缓存这些查询?

hel*_*fer 5

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

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