Question

让我们说我有一个表格，其中列出了一堆使用如下查询的帖子：

const PostsQuery = gql`
  query posts($name: string) {
    posts {
      id
      name
      status
    }
  }
`;

const query = apolloClient.watchQuery({query: PostsQuery});
query.subscribe({
  next: (posts) => console.log(posts) // [ {name: "Post 1", id: '1', status: 'pending' }, { name: "Paul's Post", id: '2', status: 'pending'} ]
});

然后我的用户出现并在搜索字段中输入一个值并调用此代码：

query.setVariables({name: 'Paul'})

它会抓取已过滤的帖子并将其记录下来。

// [ { name: "Paul's Post", id: '2', status: 'pending'} ]

现在，在我的表格中，有一个按钮可以更改帖子的状态，以便从＆＃39;待定＆＃39;到＆＃39;活跃＆＃39;用户点击它并调用以下代码：

const PostsMutation = gql`
   mutation activatePost($id: ID!) {
     activatePost(id: $id) {
        ok
        object {
           id
           name
           status
        }
     }
   }
`;
apolloClient.mutate({mutation: PostsMutation});

一切都很好的突变，但现在我想重新获取表数据，所以它有最新的，所以我做了一个改变：

apolloClient.mutate({
  mutation: PostsMutation,
  refetchQueries: [{query: PostsQuery, variables: {name: 'Paul'}]
});

华友世纪，它有效！

// [ { name: "Paul's Post", id: '2', status: 'active'} ]

但是......现在我的用户清除搜索查询，期望结果更新。

query.setVariables({});

// [ {name: "Post 1", id: '1', status: 'pending' }, { name: "Paul's Post", id: '2', status: 'pending'} ]

哦不！因为我们的＆＃34;原始＆＃34;我们的变异没有重新获取数据。变量（意思是没有），我们得到陈旧的数据！

那么你如何处理一个可能影响可能有许多变量排列的查询的突变？

Answer 1

我有一个类似的问题，我在Angular中使用了Apollo，所以我不确定该方法是否可以在React Client中使用，但是应该可以。

如果仔细查看refetchQueries方法上的mutate属性，您会发现该函数还可以返回查询名称的字符串数组以进行重新提取。通过仅以字符串形式返回查询名称，您无需担心变量。请注意，这将重新获取所有与该名称匹配的查询。因此，如果您有很多使用不同变量的查询，那么最终可能是一个大请求。但是，就我而言，值得进行权衡。如果这是一个问题，您还可以通过queryManager访问apolloClient.queryManager到apolloClient.mutate({ mutation: PostsMutation, refetchQueries: (mutationResult) => ['PostQueries'] });，可以用来对要重新提取的内容进行更精细的控制。我没有实现它，但是看起来很有可能。我发现以下解决方案适合我的需求。

在您的代码中，您需要做的是：

{{1}}

这将重新获取名称为“ PostQueries”的任何查询。同样，如果您深入查询管理器并对活动的监视查询进行一些过滤，则仅可以重新获取其中的一部分。但是，这是另一种练习。

Apollo：在变异后重新获取具有多个变量排列的查询

1 个答案: