#mutateAsync vs mutate with options. What's the difference?

6 messages · Page 1 of 1 (latest)

peak hazel
#

The docs on this page: https://tanstack.com/query/latest/docs/framework/react/guides/mutations#promises say "Use mutateAsync instead of mutate to get a promise which will resolve on success or throw on an error. This can for example be used to compose side effects." with the following code as an example:

const mutation = useMutation({ mutationFn: addTodo })
try {
  const todo = await mutation.mutateAsync(todo)
  console.log(todo)
} catch (error) {
  console.error(error)
} finally {
  console.log('done')
}```


But given that you can pass options to the mutate function, wont this code produce the same results?:
```ts
const mutation = useMutation({ mutationFn: addTodo });
mutation.mutate(todo, {
  onSuccess: (data) => {
    console.log(data);
  },
  onError: (error) => {
    console.error(error);
  },
  onSettled: () => {
    console.log("done");
  },
});```


Is there any meaningful difference? Thanks!
TanStack Query Docs
worldly vine
#

Yeah, in this example it is the same

#

But mutateAsync returns the result as a promise which you could further use in the scope whereas mutate only provides the result in a callback

mossy pasture
#

It seems to matter when doing consecutive mutations.

spring mica
pulsar jay