有很多文档和教程显示了突变的使用update
和optimisticResponse
涉及添加内容的属性,但我没有看到任何涉及删除的内容。
我不确定该代码的外观。通过创建突变,您希望通过 将新项目添加到 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
. 那是我完全不知道如何写作的部分。