update
物を追加することを伴うミューテーションとプロパティの使用を示すドキュメントとチュートリアルはたくさんありますが、optimisticResponse
削除を伴うものは見たことがありません。
そのコードがどのように見えるべきか正確にはわかりません。create ミューテーションでは、新しいアイテムを 経由update
で Apollo キャッシュに追加し、 を使用して UI に一時コピーを追加しoptimisticResponse
ます。しかし、削除の場合は、データが存在しないため、削除を「表示」しても意味がありません。
これは、Vue コンポーネントのメソッドで取得したもので、部分的に正しいです。
async handleDelete(trackId: number) {
const result = await this.$apollo.mutate({
mutation: require('@/graphql/delete-tracks.gql'),
variables: {
ids: [trackId],
},
update: store => {
const data: { getTracks: TrackList } | null = store.readQuery({
query: getTracksQuery,
variables: this.queryVars,
});
if (data && data.getTracks) {
data.getTracks.data = data.getTracks.data.filter(
(track: Track) => track.id !== trackId
);
--data.getTracks.total;
}
store.writeQuery({
query: getTracksQuery,
variables: this.queryVars,
data,
});
},
optimisticResponse: {},
});
console.log('result:', result);
},
基本的に、削除されたアイテムを Apollo キャッシュから削除する必要があることがわかりました。その部分はうまく機能しているようです。ないため、視覚的な削除はすぐには行われませんがoptimisticResponse
。それは、どう書けばいいのか全く分からない部分です。