Существует множество документации и руководств, демонстрирующих использование свойств мутации update
и optimisticResponse
, связанных с добавлением вещей, но я не видел каких-либо связанных с ними удалений.
Я не совсем уверен, как должен выглядеть этот код. С помощью мутации create вы хотите добавить новый элемент в кеш Apollo с помощью update
и добавить временную копию в пользовательский интерфейс с помощью 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
. Это та часть, которую я совершенно не знаю, как писать.