当数据在缓存中时，Apollo Client client.readQuery 返回 null

Posted 2023-03-10

【中文标题】当数据在缓存中时，Apollo Client client.readQuery 返回 null

【英文标题】：Apollo Client client.readQuery returning null when data is in the cache

【发布时间】：2021-06-16 03:29:16

【问题描述】：

这一定是用户错误，但我有一个带有简单 currentUser 查询的应用程序，它查看 JWT 的 id、查找它并返回适当的用户。

我可以查看 devtools 并看到它在缓存中为 __ref:User:19

export const CURRENT_USER_QUERY = gql`
  query
    currentUser 
      id
      fullName
      email
    
  
`

但在我的组件中，当我执行const currentUser = client.readQuery( query: CURRENT_USER_QUERY ); 时，它（间歇性地）爆炸，因为：

Cannot destructure property 'currentUser' of 'client.readQuery(...)' as it is null.

User:19 存在并且是我需要的所有东西。我点击了重新加载，并且相同的页面可以正常工作。

我在客户端中将默认错误策略设置为“全部”。

这是客户端的 3.3.11 版本。 Chrome v88.04，物有所值。反应 17.01。

我在这里遗漏了什么吗？如果该项目在缓存中，那不应该同步（并且可靠地）返回一个值吗？

有没有更好的方法来处理这种情况？我正在尝试将此应用程序从将内容存储在 redux 或某些上下文提供程序中，因为它已经由 Apollo 处理。由一堆不同的事情来处理这个责任似乎是多余的。

【问题讨论】：

这个想法是对的，只要注意可能发生的任何竞争情况，具体取决于您在使用useQuery时读取原始数据的位置

【参考方案1】：

我遇到了同样的问题。我是这样修复的：

const existingData = cache.readQuery(
        query: GET_CONTRACT,
        variables: 
          ...variables,
        ,
      );

【讨论】：

我不明白你在说什么“修复它”？

我遇到了与上述相同的错误，并分享了我是如何从缓存中检索信息的。

@Alia 感谢您的回答。添加与我的初始查询相同的变量允许我从缓存中检索数据。

@NickGelotte 太好了，乐于助人：D

啊，@Alia，我明白你在说什么，但就我而言，没有变量。 currentUser 是查询，它引用了缓存中带有 ID 的用户。对于它的价值，这个问题最近似乎已经“消失”了。至少，从那以后我再也没有遇到过。

【参考方案2】：

昨晚我遇到了.readQuery() 的问题。尽管逻辑是正确的，但我每次都返回 null。我在导入到 React 页面的组件中调用 .readQuery()。

最终成为我的问题的是，我没有更新在“父”反应页面中与组件中相同的查询。

我不知道这是否是您遇到的同一个问题，但我想我会把它留在这里，以供永久使用。

【讨论】：

确实，您需要使用相同的查询，否则缓存将找不到它。显然，这也是我的问题，谢谢！

【参考方案3】：

这里的问题可能在于新变量或缺少变量。所以查询是用变量进行的，你尝试从缓存中获取它。来自缓存的.readQuery 必须相同