如何在graphql/apollo/react中进行一系列突变后重新取回/取回

Question

现在我有一个用例，使用两个useMutations来创建/更新数据库。所以第二点取决于第一点的成功。第二个突变需要在循环中调用，想象一下我有一个数组，我需要循环遍历数组并应用第二个突变。

在所有这些突变完成后，我必须重新获取另一个API来更新缓存，因为缓存会受到这两个变化的影响。

我真的很纠结如何做到这一点。

来自另一个帖子:阿波罗客户端-多次更新后的refetchQueries我可以写

const [creatEnrollment] = useMutation(mut1)
const [updateEnrollment] = useMutation(mut2)
const [toFetch, {loading, error, data}] = useLazyQuery(UsersDocument)
await Promise.all([creatEnrollment(), updateEnrollment()])
const result = () => toFetch({
variables: {name: 'i'}
})

，但问题是1。我需要在第一次突变之后执行第二次突变;2、我需要一个数组，一个接一个地应用于第二次突变。

我也看到了我如何在React查询中等待突变执行?

可以使用onSuccess

const mutate1 = useMutation((data) => axios.post('/something', { data }))
const mutate2 = useMutation(somethingResult) => axios.put('/somethingElse', { somethingResult })
<button onClick={() => {
mutate1.mutate('data', {
onSuccess: mutate2.mutate
})
}} />

但仍然是1。如何循环通过mutate2.mutate?mutate2完成后如何取回像这样做????:

<button onClick={() => {
mutate1.mutate('data', {
onSuccess: mutate2.mutate
})
mutate2.mutate('data', {
onSuccess: query
})
}} />

谢谢你的帮助!

Answer 1

您可以为useMutation和onSuccess提供一个函数，使用get on success的数据使用其他突变

const mutationFuntion = (id) => {
// this is first mutation
return useMutation(
(newTitle) => axios
.patch(`/posts/${id}`, { title: newTitle })
.then(response => response.data),
{
// 💡 response of the mutation is passed to onSuccess
onSuccess: (data) => {
// call the api which will get all the latest update
},
}
)
}

获取第一个突变的数据

const [addTodo, { data, loading, error }] = mutationFuntion(//send data);

这是一个连续的突变，我从这个https://react-query-v3.tanstack.com/guides/mutations#consecutive-mutations doc

useMutation(addTodo, {
onSuccess: (data, error, variables, context) => {
// Will be called 3 times
},
})

['Todo 1', 'Todo 2', 'Todo 3'].forEach((todo) => {
mutate(todo, {
onSuccess: (data, error, variables, context) => {
// Will execute only once, for the last mutation (Todo 3),
// regardless which mutation resolves first 
},
})
})

For处理每个突变调用

的承诺

const mutation = useMutation(addTodo)

try {
const todo = await mutation.mutateAsync(todo)
console.log(todo)
} catch (error) {
console.error(error)
} finally {
console.log('done')
}

请您需要验证您想在哪种对象上调用循环中的突变数组或其他东西。