无法使用Apollo和GraphQL访问来自refetchQueries的返回数据

Question

我可以在“网络”标签中成功看到我的refetch收集数据。但是我看不到任何方法来检索和使用数据。

下面是我如何处理重新提取操作，我希望数据是{(mutation, result, ...rest) => {的一部分，但是rest中没有这些内容

<容器/>

const onUpdateTask = ({ render }) => <Mutation
    mutation={UPDATE_TASK}
    refetchQueries={
      [
        {
          query: GET_TASKS_BY_USER_ID,
          variables: {
            assigneeId: authStorage.get().id,
          },
        },
      ]
    }
    awaitRefetchQueries={true}
  >
    {(mutation, result, ...rest) => {
      return render({ mutation, result, rest })
    }}
  </Mutation>

export default adopt({
  onUpdateTask,
});

container.js

  <Container {...this.props}>
    {({
      onUpdateTask,
    }) => {
        console.info(onUpdateTask); //see image
    }}
  </Container>

据我所知，data已使用一些我不理解的随机查询进行了更新。

以下是“网络”标签中查询的数据：

[{"data":{"tasks":{"edges":[{"node":{"id":1,"title":"Task 11212111","createdAt":"2019-03-12T12:14:21.640904+00:00","priority":"HIGH","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":2,"title":"1Task 211","createdAt":"2019-03-12T12:14:21.642818+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":3,"title":"Task 1111","createdAt":"2019-03-12T12:14:21.644163+00:00","priority":"LOW","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":4,"title":"Cock","createdAt":"2019-03-12T12:14:21.645699+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":5,"title":"Task 5 balls","createdAt":"2019-03-12T12:14:21.646978+00:00","priority":"LOW","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":6,"title":"Task 6","createdAt":"2019-03-12T12:14:21.648202+00:00","priority":"HIGH","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":7,"title":"Task 7","createdAt":"2019-03-12T12:14:21.649414+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":8,"title":"Jamie","createdAt":"2019-03-12T12:14:21.650558+00:00","priority":"LOW","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":9,"title":"Task 911","createdAt":"2019-03-12T12:14:21.651912+00:00","priority":"HIGH","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":10,"title":"Task 10","createdAt":"2019-03-12T12:14:21.653051+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"}],"__typename":"IssueTasksConnection"}}}]

Package.json

"apollo-client": "^2.5.1",
"graphql": "14.0.2",
"graphql-tag": "2.10.0",
"react-apollo": "2.3.3",

Answer 1

<Mutation/>对象无法访问对refetchQueries的响应以在页面上显示数据-这就是<Query/>的工作。 <Mutation/>的工作是更改数据，而<Query/>的工作是（从服务器或缓存）访问数据-这就是为什么您看到“在网络选项卡中重新获取数据”的原因，您在refetchQueries中记录的查询会在自己的调用中分别触发，并将数据推送到<Query/>的缓存中以在屏幕上显示更新的数据。

触发突变时，您将获得所需的数据（如在'result.data.updateIssueByTaskId'所示），该数据将被推入缓存。在大多数情况下，这足以更新页面上所有正在观察该数据的<Query/>，但是在某些情况下（例如列表，并且您已在列表中添加了一项），您可能需要做一些干预（例如使用refetchQueries或update）

在这种情况下，我怀疑您不需要使用refetchQueries，因为您正在突变单个对象，并且我怀疑您将在页面上显示该单个对象（借助{{1} }。但是，如果在服务器上更改了数据，则将保留<Query/>。

下面是一个很小的（丑陋的）示例，其中我将您对Mutation的实现包装在获取数据的Query中。当您单击按钮时，它将触发Mutation（但没有参数，所以我猜没有变化吗？），然后Mutation将重新获取refetchQueries查询，而GET_TASKS_BY_USER_ID组件将看到更新的缓存并自动在其子级中显示新数据。 （我没有使用过查询的错误或加载状态，而是将它们放在那里，以便您了解它们）

<Query/>

试一下这样的游戏，让您了解它们的工作原理。您可能需要向变异中添加一些变量，以便数据更改，然后在屏幕上确认其更改。尝试从您的突变中删除refetchQueries，然后查看它是否仍根据需要进行更新。

如果在没有refetchQueries的情况下发现数据不会按照您想要的方式更新，但是在具有refetchQueries的情况下确实可以更新，请查看突变的“更新”选项。它是refetchQueries的替代方法，它允许您以预定的方式手动更新缓存，而不是为新数据向服务器进行往返调用。