Framework
Version
Menu
Getting Started
Guides & Concepts
Community Resources
Examples
ESLint
Plugins
API Reference

React Query

The react-query package offers a 1st-class API for using TanStack Query via React. However, all of the primitives you receive from these hooks are core APIs that are shared across all of the TanStack Adapters including the Query Client, query results, query subscriptions, etc.

Example

tsx
import { QueryClient, QueryClientProvider, useQuery } from '@tanstack/react-query'
const queryClient = new QueryClient()
function Example() {
const query = useQuery({ queryKey: ['todos'], queryFn: fetchTodos })
return (
<div>
{query.isLoading
? 'Loading...'
: query.isError
? 'Error!'
: query.data
? query.data.map((todo) => <div key={todo.id}>{todo.title}</div>)
: null}
</div>
)
}
function App () {
return (
<QueryClientProvider client={queryClient}>
<Example />
</QueryClientProvider>
)
}
Want to Skip the Docs?

Fast track your learning and
take the offical React Query course ↗️

Subscribe to Bytes

Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.

Bytes

No spam. Unsubscribe at any time.