Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

138
Views
React-Query Async Await disparar en bucle de orden incorrecto

Estoy agrupando solicitudes de mutación y disparándolas con Promise.all sin embargo, la devolución de llamada a veces se activará antes de que lo haga la mutación. Solo puedo recrear el problema al eliminar elementos individuales. Sé que hay algunos errores al hacer async/await dentro de los bucles, pero no estoy seguro de si eso es lo que está causando mis problemas.

Lo que estoy tratando de lograr:

  1. Reúna todas las mutaciones que deben ejecutarse (agregar, eliminar y actualizar tienen puntos finales diferentes y deben enviarse individualmente).

  2. Active todas las mutaciones y espere hasta que todas se completen con éxito.

  3. Recuperar la lista con todas las actualizaciones aplicadas

     useQuery('todos', () => getTodosList(), { onSuccess: ({ todos }) => { setOriginalList(todos); }, }); const saveUpdates = useCallback(async () => { const mutations = []; for (let i = 0; i < list.length; i++) { const entry = list[i]; if (entry.modified) { let mutation; const { modified, id } = entry; 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); } mutations.push(mutation); } } await Promise.all(mutations).then(() => { queryClient.invalidateQueries('todos'); }); },[...all the dependencies]);
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

En su if/else no está asignando una Promesa a la mutación sino el resultado de la promesa. Luego, los está resolviendo a continuación con await Promise.all

No debes esperar en la asignación del bucle.

En vez de

 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); }

Deberías escribir

 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); }
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!