ReactQuery, also known as TanStack Query, is a library that provides a simple, yet powerful way to fetch, cache, and manage data in your React applications. It is designed to work seamlessly with the React ecosystem.
This library’s got a ton of cool hooks for working with APIs. I’ve been mostly messing around with useQuery, useMutation, and useInfiniteQuery. Each one returns an object packed with super handy properties. I won’t get into every single one in this blog post, but do yourself a favor and check them out here: https://tanstack.com/query/v4/docs/react/reference/useQuery.
Heads up! This documentation is tailored for TanStack Query v4. The developers have recently released TanStack Query v5. Explore the new version here: https://tanstack.com/query/v5/docs/react/reference/useQuery
The properties that seem to cause the most confusion are isLoading, isFetching, and isRefetching. Let me explain what those are:
isLoading: This state is set to true exclusively during the initial data fetching.
isFetching: This state is true every time an API call is made, regardless if we did it manually or not.
isRefetching: This state is only true when we’re deliberately refetching with the refetch() function.