Reactjs 无法使用useQuery挂钩获取包含某些@client变量的远程查询的数据

下面给出的查询获取产品列表并将其存储在apollo客户端本地缓存中。它检索每个产品的

产品列表

和

图像列表

const GET_PRODUCTS_QUERY = gql`
  query Products($cursor: String, $query: String, $imageCount: Int = 100) {
    products(first: 9, after: $cursor, query: $query) {
      edges {
        cursor
        node {
          id
          selected @client
          title
          description
          images(first: $imageCount) {
            edges {
              node {
                id
                originalSrc
                selected @client
              }
            }
          }
        }
      }
    }
  }
`;

我有一堆

产品

选择了

为真

，每个产品都会有一个或多个

图像

选择了

为真

GET\u PRODUCTS\u查询

正由获取产品并呈现产品的

ProductsList

组件使用。这很好用。当用户选择某个产品时，所选的

将在本地缓存和
ProductsList
组件重新加载程序中标记为true。到目前为止还不错

我还有另一个组件，我需要使用相同的
GET\u PRODUCTS\u QUERY
来获取产品，但是只能从缓存中获取。此组件应侦听缓存中的产品列表，并且每当缓存中发生更改时，应重新加载。我试着做了以下几件事，但都没有用

export default () => {
  const { data: productsData = {} } = useQuery(GET_PRODUCTS_QUERY, { fetchPolicy: "cache-only" });
  const { selectedProducts = [] } = productsData;
  //Render selected products
}

在初始呈现期间，将执行查询，并且不会按预期返回任何内容


ProductsList获取产品列表并填充缓存后，我希望在侦听查询时调用render函数，但没有发生
我通过更改一些其他道具手动影响渲染，以便触发useQuery。但我仍然没有从缓存中获得任何产品，尽管它在那里

谁能解释一下我哪里出错了吗？
您正在获取两个不同的查询--您需要确保不仅查询相同，而且传递给两个钩子的变量也相同

这样想吧。例如，当您获取20种产品时

products(first: 20)

Apollo将结果存储在缓存中时对其进行规范化。每个产品单独存储并分配一个密钥。然后，
products
字段与这些键相关联。但是，想象一下，如果您随后查询了21种产品：

products(first: 21)

如果Apollo忽略传递给字段的参数值，它会将其视为缓存命中，只返回与先前查询关联的20个产品。幸运的是，它没有这样做。每个键列表不仅与字段关联，还与提供给字段的参数关联。如果参数发生变化，并且参数组合不在缓存中，那么Apollo知道它需要从服务器获取数据。
您正在获取两个不同的查询--您需要确保不仅查询相同，而且传递到两个挂钩的变量也相同

这样想吧。例如，当您获取20种产品时

products(first: 20)

Apollo将结果存储在缓存中时对其进行规范化。每个产品单独存储并分配一个密钥。然后，
products
字段与这些键相关联。但是，想象一下，如果您随后查询了21种产品：

products(first: 21)

如果Apollo忽略传递给字段的参数值，它会将其视为缓存命中，只返回与先前查询关联的20个产品。幸运的是，它没有这样做。每个键列表不仅与字段关联，还与提供给字段的参数关联。如果参数发生变化，并且参数组合不在缓存中，那么Apollo知道它需要从服务器获取数据。
实际上，我没有为变量传递任何值。这意味着在这两种情况下，
first
都是9<代码>光标

和

查询

也没有被传递。想知道它是否与此问题相关，您确定

光标

和

查询

未定义吗？例如，

query

最初是一个空字符串吗？我很确定是这样的。我现在没有代码，因为我使用了另一种方法，为选定的产品和图像维护单独的数据结构。这对我很管用。我稍后再试一次。不管怎样，我尝试的上述方法是实现嵌套选择功能的正确方法吗？像这样的嵌套字段对于派生字段非常有用，但在处理实际状态时有点痛苦。在我处理类似情况的少数几次中，我通常从根本上保留地方政府，这听起来像是你最终所做的。没有那么优雅，但是更容易维护。实际上我没有为变量传递任何值。这意味着在这两种情况下，

first

都是9<代码>光标和

查询

也没有被传递。想知道它是否与此问题相关，您确定

光标

和

查询

未定义吗？例如，

query

最初是一个空字符串吗？我很确定是这样的。我现在没有代码，因为我使用了另一种方法，为选定的产品和图像维护单独的数据结构。这对我很管用。我稍后再试一次。不管怎样，我尝试的上述方法是实现嵌套选择功能的正确方法吗？像这样的嵌套字段对于派生字段非常有用，但在处理实际状态时有点痛苦。在我处理类似情况的少数几次中，我通常从根本上保留地方政府，这听起来像是你最终所做的。不那么优雅，但更容易维护。