私は反応アプリを構築しています。データシートがあり、更新のためにデータを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 が再レンダリングされません。