突变后自动更新apollo客户端缓存,不影响现有查询

问题描述 投票:0回答:1

我有一个变体(UploadTransaction),它返回某些名为Transaction的对象的某些列表。

#import "TransactionFields.gql" 
mutation UploadTransaction($files: [Upload!]!) {
  uploadFile(files: $files){
    transactions {
      ...TransactionFields
    }
  }
}

从后端(石墨烯)返回的交易具有id和typename字段。因此,它应该自动更新缓存中的Transaction。在用于Apollo的chrome开发工具中,我可以看到新的事务:

enter image description here

我也有一个查询GetTransactions来获取所有Transaction对象。

#import "TransactionFields.gql"
query GetTransactions {
  transactions {
    ...TransactionFields
  }
}

但是我没有看到查询返回新添加的事务。在初始加载期间,Apollo客户端加载了292个在ROOT_QUERY下显示的事务。它不断返回相同的292笔交易。 UploadTransaction变异会在开发人员工具的缓存中添加类型为“事务”的新对象,而不会影响开发人员工具中的ROOT_QUERY或代码中的查询。

enter image description here

TransactionFields.gql是

fragment TransactionFields on Transaction {
    id
    timestamp
    description
    amount
    category {
      id
      name
    }
    currency
}

知道我在做什么错吗?我是apollo客户和graphql的新手

graphql react-apollo apollo-client
1个回答
0
投票

docs

如果突变更新了一个现有实体,则当突变返回时,Apollo Client可以自动更新其实体在其缓存中的值。为此,变异必须返回修改后的实体的ID,以及修改后的字段的值。方便地,默认情况下,变异会在Apollo Client中执行此操作...

[如果突变修改了多个实体,或者如果它创建或删除了实体,则自动更新Apollo客户端缓存以反映突变的结果。要解决此问题,您可以使用useMutation调用包括更新功能。

如果您有一个查询,该查询返回一个实体列表(例如,用户),然后创建或删除一个用户,则Apollo无法知道列表[[应
已更新以反映您的突变。原因是两个原因

Apollo无法知道

    what

突变实际上正在做什么。它所知道的就是您要请求的字段以及传递这些字段的参数。我们可能会假设一个包含“插入”或“创建”之类的词的突变正在后端插入某些东西,但这不是给定的。
  • 没有办法知道插入,删除或更新用户应该
  • 更新特定查询。您的查询可能针对所有名称为“ Bob”的用户-如果您创建的名称为“ Susan”的用户,则不应更新查询以反映该添加。同样,如果突变更新了用户,则需要更新查询
  • might以反映更改。是否最终归结为只有您的服务器知道的业务规则。
  • 因此,为了更新缓存,您有两个选择:

    触发相关查询的重新引用。您可以通过将refetchQueries选项传递到useMutation钩子或通过manually calling refetch on those queries来实现。由于这需要向您的服务器发送一个或多个其他请求,因此这是较慢且较昂贵的选择,但在以下情况下可能是正确的选择:A)您不想将大量业务逻辑注入客户端或B)更新服务器缓存复杂且范围广泛。

      向您的refetch钩子提供update函数,该函数告诉Apollo
    • 如何
    • 根据突变结果更新缓存。这样可以避免您发出任何其他请求,但是这意味着您必须在服务器和客户端之间重复一些业务逻辑。
  • 在文档中使用useMutation的示例:update

    阅读文档以获取更多详细信息。

  • © www.soinside.com 2019 - 2024. All rights reserved.