react-query - What's the difference between useQuery and useMutation hook?

Question

Trying to find an answer regarding react-query.

What's the difference between useQuery and useMutation?

From what i understand useQuery's are dependent calls.

useMutation are for posts that require updating the current state (cache invalidation, etc)

is that the correct assumption?

Robledo

Answer 1

From Tanner Linsley:

The difference is the flow of data. useQuery is used to query async data, useMutation is used to mutate it. Or in the traditional CRUD speak:

• Read: useQuery
• Create/Update/Delete: useMutation

https://twitter.com/tannerlinsley/status/1324384797939003393

Robledo

Generally yes, however you could still use useMutation to read data in some cases. Eg: Triggering a request on a user action. – Aiken

Answer 2

Quoting Tanner Linsley (the creator of react-query)

useQuery is declarative, useMutation is imperative. Source: https://tkdodo.eu/blog/mastering-mutations-in-react-query#differences-to-usequery

Which means, useQuery runs when component is in focus, or is mounted; whereas useMutation has to be 'invoked'.

Also, as you may call same useQuery multiple times from multiple locations, that is not the case with useMutation.

Ninny

Source : tkdodo.eu/blog/… – Rattle

Answer 3

useQuery is used when you want to fetch or read data from a server, while useMutation is used when you want to create, update, or delete data.

Overhear

i t;hink so i am correct – Overhear