使用`react-apollo-hooks`和`useSubscription`钩子时,如何避免“自动更新”缓存

我有一些 Apollo-Hooks 代码,它们使用useSubscription来监听订阅中的事件更改:

useSubscription<MySubscriptionUpdated>(MySubscription,{
    onSubscriptionData: async ({ client,subscriptionData: { data } }) => {
      if (!data) {
        return;
      }
      ...

此代码会自动更新响应上的缓存,这在大多数情况下都很好

但是,我需要在收到响应后的 中做一些结果处理,但是要在更新缓存之前

有人知道使用useSubscription钩子的方式吗?不是是否可以自动更新缓存?

该响应最终将始终具有其中带有__typename的实体。

hexiansheng108 回答:使用`react-apollo-hooks`和`useSubscription`钩子时,如何避免“自动更新”缓存

您可以为每个订阅更改fetchPolicy。默认值为cache-first。要禁用缓存,必须将fetchPolicy设置为no-cache。有关更多详细信息,请参见apollo official document

useSubscription<MySubscriptionUpdated>(MySubscription,{
    fetchPolicy: "no-cache",onSubscriptionData: async ({ client,subscriptionData: { data } }) => {
      if (!data) {
        return;
      }
      ...
,

因此,您可以进行手动缓存更新,看起来像这样

apollo.mutate({
  mutation: createTaskMutation,variables: item,update: (cache,{ data }) => {
    try {
      let { allTasks } = cache.readQuery({ query: getTasks });
      allTasks.push(data);
      cache.writeQuery({ //
        query: getTasks,data: {
            'allTasks': allTasks
        }
      });
    } catch (e) {
        // We should always catch here,// as the cache may be empty or the query may fail
    }
});
本文链接:https://www.f2er.com/3143107.html

大家都在问