不调用graphql服务器更新apollo缓存apollo v3.3

如何解决不调用graphql服务器更新apollo缓存apollo v3.3

我正在构建一个反应应用程序，我有一个数据表并直接在数据流上更新我希望当我将数据发送到 graphql 服务器进行更新并获得 true 结果时，我将使用 cache.writeQuery

更新阿波罗缓存

问题是下面代码执行的时候，还有一个请求给graphql服务器去获取全表的数据并更新缓存，我不想请求给graphql服务器工作。在那里，我想从浏览器更新。那么我哪里出错了？

这是我的代码

updateInventoryCache: async (_,{ inventory,productId,variables },{ cache }) => {
      let variablesData;
      if (variables) {
        variablesData = JSON.parse(variables);
      }
      const { getListProduct } = cache.readQuery({
        query: GET_PAGING_PRODUCT,variables: variablesData.variables
      });
      cache.writeQuery({
        query: GET_PAGING_PRODUCT,variables: variablesData.variables,data: {
          getListProduct: {
            ...getListProduct,products: getListProduct.products.map((product) => {
              if (product.id === productId) {
                return {
                  ...product,inventory
                };
              }
              return product;
            })
          }
        }
      });
      return true;
    }

"@apollo/client": "^3.3.7"

更新 1：

我将首先调用 graphql 服务器来获取数据并将其存储在 apollo 的（缓存和网络）缓存中。然后我想更新缓存中的数据，而不必将 apollo 服务器调用到 refetchQueries 就像在帖子中一样，我使用了 client.writeQuery 函数来更新缓存，而不是在客户端更新，apollo在我不使用 refetchQueries 时调用了 graphql 服务器以获取新数据并更新缓存。

更新2：我查了一下，我的缓存已经更新，但我的 UI 没有重新渲染

解决方法

使用 fetchPolice="cache-only" 只使用缓存 https://www.apollographql.com/docs/react/data/queries/#setting-a-fetch-policy

我相信您正在寻找的是 nextFetchPolicy="cache-first"： https://www.apollographql.com/docs/react/data/queries/#usequery-api

nextFetchPolicy

FetchPolicy 开始执行在当前请求之后。用于切换回 cache-first 在 cache-and-network 或 network-only 之后。

在您调用 cache.writeQuery 之后，您的数据表查询将检查 cache-first 以查看是否存在所有必需的数据。如果你得到缓存命中，它会立即返回数据而不加载。

请记住，对于 AC3，有时多个查询可以共享相同的缓存对象但请求不同的字段。如果 cache.writeQuery 或您的 typePolicies 合并导致缓存中缺少活动查询字段，则会导致该查询的缓存未命中。 IE。曾经具有有效 data 的活动查询将突然返回 undefined。 More on that issue here.