Apollo-Client GraphQL refetchQueries 是如何工作的？答案

【问题标题】：How does Apollo-Client GraphQL refetchQueries works?Apollo-Client GraphQL refetchQueries 是如何工作的？
【发布时间】：2020-02-14 07:00:50
【问题描述】：

知道如何从refetchQueries 获取响应数据吗？我从突变中得到了查询响应数据。

变异

import { gql } from 'apollo-boost';

export const DONE_TASK = gql`
    mutation DoneTask($taskId: ID!) {
        doneTask(input: {
            taskId: $taskId
        }) {
            task {
                id
                status
            }
        }
    }
`;

查询

import { gql } from 'apollo-boost';

export const GET_TASKS_BY_STATUS = gql`
    query GetTasksByStatus($status: String!) {
        getTasksByStatus(status: $status) {
            edges {
                node {
                    id
                    status
                    description
                }
            }
        }
    }
`;

用法

const response = await client.mutate({
    mutation: DONE_TASK,
    variables: {
        taskId: 1
    },
    refetchQueries: () => [{
        query: GET_TASKS_BY_STATUS,
        variables: { 
            status: "OPEN"
        },
    }]
});

console.log(response);

输出

data: {
    doneTask: {
        task: { id:  1, status: 'DONE'}
    }
}

但我希望得到来自GET_TASKS_BY_STATUS 的响应数据。

???? ？？？

【问题讨论】：

标签： reactjs graphql apollo-client

【解决方案1】：

您重新通过refetchQueries 获取的任何查询都应该已被某些useQuery 钩子、Query 组件或graphql HOC 使用。为了访问与突变相同的组件内的数据，您需要利用在同一组件内重新获取的查询：

const { data } = useQuery(GET_TASKS_BY_STATUS, { variables: { status: 'OPEN' } })
const [mutate] = useMutation(DONE_TASK,{
  variables: {
    taskId: 1,
  },
  refetchQueries: () => [{
    query: GET_TASKS_BY_STATUS,
    variables: { 
      status: 'OPEN',
    },
  }],
})

【讨论】：

哦，谢谢指教，这就是为什么没有变化，因为client.query(GET_TASKS_BY_STATUS)被放在了不同的组件中。
@Roel 顺便说一句，您应该避免使用client.query，除非您需要只获取一次查询。如果您需要在缓存更新时更新查询数据，请使用useQuery、Query 组件或graphql HOC，如答案所示。
我仍处于开发状态。在我的本地，我使用 refetchQueries。所以每次我添加或更新时，我的列表都会再次重新获取。我的问题是，在生产中，其他用户会看到另一个用户添加的最新记录。我虽然在内存缓存中是在客户端。那么其他用户将如何获得迟到的记录。