React Query异步等待在错误的顺序循环中触发

Question

我正在批次突变请求，并使用Promise.all启动它们，但是，回调有时会在突变发生之前触发。我只能在删除单个项目时重新创建该问题。我知道在循环中执行异步/等待时存在一些问题，但我不确定这是否是导致我的问题的原因。

我想要做的是：

individually).

• 收集所有需要运行的突变(添加、删除和更新有不同的端点，并且必须发送

• )。

1. 触发所有的突变，直到它们都成功完成。

1. 重新获取列表，并应用所有更新

useQuery(' todos '，() => getTodosList ()，{ onSuccess：({ todos }) => { setOriginalList(todos)；}，}；const saveUpdates =useCallback(异步() => { const突变=[])；for (设i= 0；i< list.length；i++) { const entry = listi；if (entry.modified) { let突变；const { modified，id }= entry；if (修改=== MODIFICATION.Deleted) {诱变=等待deleteMutation.mutateAsync(id)；} if (修改=== MODIFICATION.Updated) {突变=等待updateMutation.mutateAsync(入口)；} if (修改=== MODIFICATION.Added) {突变=等待createMutation.mutateAsync(入口)；}等待dependencies);的Promise.all(突变).then(() => { queryClient.invalidateQueries('todos')；})；}，...all

Answer 1

在你的“如果”/“其他”中，你不是把承诺分配给突变，而是指定承诺的结果。然后，您将使用await Promise.all解决所有这些问题

你不应该在分配循环时等待

而不是

if (modified === MODIFICATION.Deleted) {
  mutation = await deleteMutation.mutateAsync(id);
} else if (modified === MODIFICATION.Updated) {
  mutation = await updateMutation.mutateAsync(entry);
} else if (modified === MODIFICATION.Added) {
  mutation = await createMutation.mutateAsync(entry);
}

你应该写

if (modified === MODIFICATION.Deleted) {
  mutation = deleteMutation.mutateAsync(id);
} else if (modified === MODIFICATION.Updated) {
  mutation = updateMutation.mutateAsync(entry);
} else if (modified === MODIFICATION.Added) {
  mutation = createMutation.mutateAsync(entry);
}