Apollo 客户端 - 从缓存中读取

Posted 2023-03-08

【中文标题】Apollo 客户端 - 从缓存中读取

【英文标题】：Apollo Client - reading from cache

【发布时间】：2021-06-05 00:44:37

【问题描述】：

React + Apollo 客户端应用。我正在尝试使用 readQuery 从我的缓存中读取，但无法读取缓存的字段。

这里有一个纲要：

组件SinglePost 调用useQuery，它执行我的GET_POST 查询并缓存结果。 GET_POST 查询返回类型 Post!。一切都很好，开发工具显示ROOT_QUERY 包含一个名为 getPost 的字段和该帖子。

const  loading, data  = useQuery(GET_POST, 
    variables: 
      postID,
    
);

SinglePost 有一个子组件DeleteButton，它会在点击时删除评论。它调用useMutation 并删除评论。 DELETE_COMMENT查询返回类型Comment!。

const [deleteComment] = useMutation(DELETE_COMMENT, 
    variables: 
      postID,
      commentID,
    ,
);

Post 有一个 cmets 数组，现在我需要在缓存中更新它的数组并删除已删除的评论。我在deleteComment 突变中使用update 函数来获取缓存对象并使用readQuery 从中获取getPost 字段，但它甚至返回null虽然它在开发工具中。

update(cache, result) 
  const cacheData = cache.readQuery(
    query: GET_POST,
  );
  // code that doesn't run because cacheData is null

我怀疑当通过返回 Post 类型的突变对帖子进行突变时，它会成功读取 getPost 字段，但是当突变查询返回 Comment 类型时，它无法读取 getPost 在它的变异钩子中...因为没有引用 Post 类型？

现在我使用refetchQueries 作为解决方法。我不喜欢对服务器进行额外的调用，但我光滑的大脑无法弄清楚这一点。任何帮助表示赞赏。

【问题讨论】：

你必须传递相同的变量（postID）

你是对的！！！我忘记了变量。谢谢！

【参考方案1】：

哎呀，没有变量被传递给查询。

update(cache, result) 
  const cacheData = cache.readQuery(
    query: GET_POST,
    variables: 
      postID
    
  );