Optimistic Update

React 🟡 Mid

Type : React Data

Definition

Technique qui met a jour l'UI immediatement avant la reponse serveur, avec rollback en cas d'echec.

Analogie

Comme un systeme de reservation qui affiche 'reserve' instantanement et annule si le paiement echoue.

Exemple de code

onMutate: async (newTodo) => {
  await queryClient.cancelQueries([class="str">&#39;todos&#39;]);
  const prev = queryClient.getQueryData([class="str">&#39;todos&#39;]);
  queryClient.setQueryData([class="str">&#39;todos&#39;], old => [...old, newTodo]);
  return { prev };
}