ApolloClient-使用对象列表中的缓存结果来响应对单个对象的查询

html5 • • 问答

是否可以将 Apollo Client 配置为从返回项目列表的查询中获取单个缓存的项目，以便在查询单个项目时预取数据？

架构：

type Item {
  id: ID!
  name: String!
}

type Query {
  items: [Item!]!
  itemById(id: ID!): Item!
}

查询 1：

query HomepageList {
  items {
    id
    name
  }
}

查询 2：

query ItemDetail($id: ID!) {
  itemById(id: $id) {
    id
    name
  }
}

鉴于单个 Item 的数据已经在缓存中，应该可以使用已经缓存的数据，同时仍然执行提取，以防任何数据发生更改。

然而，查询并不使用缓存的数据（至少默认情况下），似乎我们需要以某种方式告诉 Apollo 我们知道该 Item 已经在缓存中。

非常感谢任何帮助。

回答

此功能存在，但如果您不知道要查找的内容，则很难找到。在 Apollo Client v2 中，您正在寻找缓存重定向功能，在 Apollo Client v3 中，这被类型策略/字段读取策略 ( v3 docs )取代。

Apollo 不“知道”你的 GraphQL 模式，这使得它可以在日常使用中轻松设置和使用。然而，这意味着给定一些查询（例如getBooks）它不知道结果类型将是什么预先。只要启用了 __typename，它就会知道它之后。这是默认行为，是规范化缓存所必需的。

假设您有一个getBooks获取Books列表的查询。如果在此请求完成后使用 Apollo devtools 检查缓存，您应该使用typename 和id的Book:123键在缓存中找到书籍。如果它存在（并被查询！）该字段将用作缓存的标识符。如果您的 id 字段有其他名称，您可以使用缓存的 typePolicies 将这个字段通知 Apollo InMemoryCache。Book123id

如果你已经设置了它，然后你运行一个getBook查询，使用一些 id 作为输入，你将不会获得任何缓存数据。原因如前所述：Apollo 不知道该查询将返回哪种类型。

因此，在 Apollo v2 中，您将使用 cacheRedirect 将 Apollo“重定向”到正确的缓存：

  cacheRedirects: {
    Query: {
      getBook(_, args, { getCacheKey }) {
        return getCacheKey({
          __typename: 'Book',
          id: args.id,
        });
      }
    },
  },

（args.id如果您在 typePolicy 中指定了另一个键，则应替换为另一个标识符）

使用 Apollo v3 时，您需要一个 typepolicy / field read 策略：

  typePolicies: {
    Query: {
      fields: {
        getBook(_, { args, toReference }) {
          return toReference({
            __typename: 'Book',
            id: args.id,
          });
        }
      }
    }
  }

以上是ApolloClient-使用对象列表中的缓存结果来响应对单个对象的查询的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>