Apollo local state - 如何通过id查询

Question

如果我们有 todos 项目，比如 apollo 客户端状态缓存中的对象数组 - todos: [{name: 'First', id: 1}, {name: 'Second', id: 2} ].有没有办法通过 id 查询我们需要的对象。类似于 reselect - redux 中的选择器。我要用id订阅

Answer 1

Apollo 允许您使用@client 指令进行本地状态管理。因此，您可以创建类似下面的查询，以根据 id 获取单个 TODO。

query getTodoById(id: ID!) @client {
  todo {
    name,
    id
  }
}

mutation setTodoById(id: ID!, todo: Todo!) @client {
  todo {
    name,
    id
  }
}

现在，您需要为上面的查询创建一个自定义客户端解析器，以便 Apollo 知道它应该在哪里查找缓存中的数据。自定义解析器将采用名为 getCachedKey 的参数，该参数基于 typename 和 Id 生成对象的键。 Apollo 使用这个从自定义解析器生成的 Id 来查找缓存中的数据（todos 列表）。

您的自定义客户端解析器应如下所示：

  cacheRedirects: {
    Query: {
      todo: (_, args, { getCacheKey }) =>
        getCacheKey({ __typename: 'Todo', id: args.id })
    },
  };

Apollo local state - 如何通过id查询

Apollo local state - how to query by id

reactjs

graphql

react-apollo

apollo-client