0

私は反応アプリを構築しています。データシートがあり、更新のためにデータをgraphqlサーバーに送信してtrue結果を取得するときに、必要なデータストリームで直接更新してから、apolloキャッシュを更新します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 の (キャッシュおよびネットワーク) キャッシュに格納します。次に、アポロサーバーを呼び出さずにキャッシュ内のそのデータを更新したいrefetchQueries投稿のように、client.writeQuery関数を使用してキャッシュを更新しましたが、クライアントで更新する代わりに、アポロはgraphqlサーバーを呼び出して新しいデータを取得して更新しました使用していなかったときのキャッシュrefetchQueries

更新 2: 確認しました。キャッシュは更新されていますが、UI が再レンダリングされません。

4

2 に答える 2