调用使用阿波罗缓存一次存储的提取API?

时间:2019-11-01 06:05:58

标签: reactjs graphql apollo apollo-cache-inmemory

我一直在研究Apollo GQL。我正在使用阿波罗缓存来减少不需要的API调用。我现在面临的问题是,当我更新数据时,我不应该重新获取数据,因为该API已经被调用一次并存储在缓存中。

  • 我想做的是为特定查询清除缓存或从服务器中重新获取数据。
  • 我无法清除整个缓存,因为我调用了许多API

在下一个突变调用之后,我必须重新获取数据。

const [
reopenInvoice,
{ loading: reopenLoading, data: reopenData, error: reopenError },
] = useMutation<IReopenData, IReopenVariables>(INVOICE_CLONE, {
onCompleted: ({ invoiceClone: { errors, status } }) => {
  if (!errors || !errors.length) {
    message.success("Invoice Reopened");
  } else {
    message.error(errors.join(" "));
  }
},
});

1 个答案:

答案 0 :(得分:1)

“ refetchQueries”是更新缓存的最简单方法。

https://www.apollographql.com/docs/angular/features/cache-updates/#refetchqueries

.header:before {
    content: "";
    position: absolute;
    top: -200px;
    right: -500px;
    z-index: -999;
    background: #043d7a;
    width: 1200px;
    height: 700px;
    -webkit-animation: move 20s linear infinite;
    animation: move 20s linear infinite;
    border-radius: 70% 30% 30% 70%/60% 40% 60% 40%
}

@-webkit-keyframes move {
    0% {
        border-radius: 70% 30% 30% 70%/60% 40% 60% 40%
    }
    25% {
        width: 1190px;
        border-radius: 72% 47% 43% 67%/54% 34% 69% 56%
    }
    50% {
        width: 1170px;
        border-radius: 72% 34% 66% 34%/54% 34% 69% 56%
    }
    75% {
        width: 1190px;
        border-radius: 72% 47% 43% 67%/37% 61% 46% 73%
    }
    100% {
        width: 1200px;
        border-radius: 70% 30% 30% 70%/60% 40% 60% 40%
    }
}

@keyframes move {
    0% {
        border-radius: 70% 30% 30% 70%/60% 40% 60% 40%
    }
    25% {
        width: 1210px;
        border-radius: 72% 47% 43% 67%/54% 34% 69% 56%
    }
    50% {
        width: 1150px;
        border-radius: 72% 34% 66% 34%/54% 34% 69% 56%
    }
    75% {
        width: 1170px;
        border-radius: 72% 47% 43% 67%/37% 61% 46% 73%
    }
    100% {
        width: 1200px;
        border-radius: 70% 30% 30% 70%/60% 40% 60% 40%
    }
}