Apollo Client - 多次更新后的 refetchQueries

Question

我正在使用 Apollo 客户端 3 并尝试构建一个 editable table

我有多个 API 突变，我应该在最后一个突变后触发 refetchQueries。

例如：

  const [updateName] = useMutation(updateNameD)
  const [updateAge] = useMutation(updateAgeD)
  const [updateCity] = useMutation(updateCityD, {refetchQueries: () => [{ query: UsersDocument }],})

问题：突变的顺序不会始终相同，我需要在最后一个突变中重新获取查询

Answer 1

如果需要一次执行所有三个突变，那么您可以将三个突变查询合并为一个查询，并且您的 refetchQueries 只有在突变查询（组合的一个）完成后才会执行。请不要在合并查询时只有一个 useMutation 挂钩。

如果您有不同的用例，请告诉我。

[编辑] 如果不能分组查询，可以采用以下方法。

const [updateName] = useMutation(updateNameD)
const [updateAge] = useMutation(updateAgeD)
const [updateCity] = useMutation(updateCityD)
const [refetchPageData] = useLazyQuery(UsersDocument)

Promise.all(updateName(), updateAge(), updatedCity()).then(res => {
    refetchPageData()
})

Answer 2

找到另一个解决方法： useQuery hook return 也是一个 refetch 方法，然后你可以随时随地使用它

const [updateName] = useMutation(updateNameD)
const [updateAge] = useMutation(updateAgeD)
const [updateCity] = useMutation(updateCityD)
const {data, refetch} = useQuery(UsersDocument)

await Promise.all([updateName(), updateAge(), updatedCity()])
refetch()

Apollo Client - 多次更新后的 refetchQueries

Apollo Client - refetchQueries after multiple updates

react-apollo

apollo-client