在单独的查询中加载 __typename 字段 Apollo-Client 未更新 UI

Posted 2023-03-08

【中文标题】在单独的查询中加载 __typename 字段 Apollo-Client 未更新 UI

【英文标题】：Loading __typename fields in seperate queries Apollo-Client not Updating UI

【发布时间】：2021-01-11 22:38:56

【问题描述】：

我正在尝试分两步加载有关类型的信息（因为我在 secondQuery 中要求的信息需要一些时间才能加载）：

组件：

const MyComponent = (startDate) => 
  const firstQuery = useQuery(
    GET_INFO_PART_ONE,
    
     variables: startDate
    
  );

  const secondQuery = useQuery(
    GET_INFO_PART_TWO,
    
     variables: startDate
    
  );

查询：

export const GET_INFO_PART_ONE = gql`
  query getInfoPartOne(
    $startDate: DateTime!
  ) 
    infoPageResults(
      startDate: $startDate
    ) 
      edges 
        info 
          infoID
          infoFieldOne
          infoFieldTwo
          infoFieldThree
        
      
    
  
`;

export const GET_INFO_PART_TWO = gql`
  query getInfoPartTwo(
    $startDate: DateTime!
  ) 
    infoPageResults(
      startDate: $startDate
    ) 
      edges 
        info 
          infoID
          infoFieldFour
            netRate
          
        
      
    
  
`;

当我这样做并且两个查询都解决时，缓存的 ROOT_QUERY 包含我期望的数据，其中 infoPageResults 包含一个边数组，其中每个边的 info __typename 包括在 GET_INFO_PART_ONE 和 @987654325 中指定的字段@查询。然后，我希望上述组件中的 firstQuery.data.infoPageResults.edges 包含从第二个查询加载的字段。

问题

在 firstQuery 和 secondQuery 都完成加载后，firstQuery.data.infoPageResults.edges 不包含 secondQuery 加载的字段，即使缓存的值看起来像我预期的那样。

我对查询挂钩的工作方式有什么明显的误解吗？ 有没有更好的策略分两步将附加字段加载到 _typename 上？

【参考方案1】：

只缓存查询的内容 ...没有缓存节点条目（另外，单独 - 因为缓存正在规范化缓存），因为没有 id 字段（默认情况下需要作为唯一条目 ID）。 .. 可以自定义使用infoID 作为信息类型（参见文档）。

正确缓存的节点（信息）条目可用于在第二个查询结果呈现列表中显示节点详细信息（来自第一个查询）...在子组件（react )。

从更标准的示例/教程开始探索可能性。

---

更新

不，单独获取的数据可以单独访问 ...不是缓存问题，也不是查询问题...

第一个查询不会返回在第二个查询中获取的字段/属性...设计使然； 当第二个查询结果到达时，使用第一个结果呈现的列表不会被刷新...如果不包含参考/不消耗第二个数据；

在传递给某些视图组件之前，您可以并行使用/传递这两个数据或组合它们（以不可变的方式）（'Presentational and Container Component Pattern'）... 列表可以使用一个道具渲染并在第二个道具更改时更新。

【讨论】：

感谢您的回复，但我不确定您在这里建议什么。客户端的InMemoryCache 通过dataIdFromObject 配置选项配置为使用infoID 而不是默认的id 字段。如果我想要所有info pageResults 的所有详细信息（从第一个和第二个查询加载），您是否建议我添加一个仅缓存策略的第三个查询？

...您应该提及所有非标准配置/使用...并描述您如何传递或呈现这些数据...以及未更新的内容...

很公平。感谢您的回答。听起来这是我对查询挂钩如何工作的核心误解。