使用 Vue Router 重定向到页面后如何重新获取 apollo 查询？

【问题标题】：使用 Vue Router 重定向到页面后如何重新获取 apollo 查询？(How to refetch apollo query after i redirect to page with Vue Router?)
【发布时间】：2022-01-29 16:08:39
【问题描述】：

我通过 apollo 突变删除了页面中的一些资源：

async delete () {
  await this.$apollo.mutate({
    mutation: orderDelete,
    variables: {
      id: this.order.id
    }
  })

  this.$emit('success')
}

这是 success 发射器触发的方法：

onOrderDeleted () {
  this.closeModal('modalOrderDelete')

  this.$nextTick(() => {
    this.redirectToClient()
  })
},
redirectToClient () {
  this.$router.push({
    name: 'clients.show',
    params: { clientKey: this.clientKey }
  })
}

这是发生的事情：当页面被重定向到 clients.show 时，即使我删除了它，订单仍然会显示，只有在我刷新整个页面时才会更新。

所以我想知道当我重定向到此页面时如何触发查询刷新？ Apollo 可能将数据保存在缓存中而不是更新它，我不知道如何仅更新此特定查询的缓存，但所有这些都是以编程方式进行的，因为用户将通过 Vue Router 重定向。

注意： clients.show 显示了一个订单列表，因此它应该更新删除我刚刚删除的订单的订单，但它并没有改变。

【解决方案1】：

this.$apollo.mutate() 的功能比你使用的要多：

对象如下所示：

this.$apollo.mutate({
  mutation: someGql,
  variables: {
    label: param1,
  },
  update: function(store, response) => {
    // how to update the store
  },
  optimisticResponse: theResponseYouExpect,
})

因此，您发送了 gql ，但没有处理来自该查询的响应（来自服务器的真实响应或乐观响应（您期望成功））

更多关于 Vue Apollo 突变 here 。

那么我在 update 方法中到底做了什么？如何更新在另一个页面中调用的其他查询完全不同？你有任何链接解释吗？
@JoãoHamerski 不幸的是，没有针对您的确切问题的确切解决方案。但一般来说：Apollo 缓存数据，你需要在页面更改事件上更新该缓存（通过突变的 update 函数或通过重新查询数据集等）
由于某种原因尝试读取缓存时出现此错误： stackoverflow.com/questions/70908036/…

分享于2022年07月17日 apollo javascript vue-apollo vue.js 问答