The useQueries
hook can be used to fetch a variable number of queries:
const results = useQueries({ queries: [ { queryKey: ['post', 1], queryFn: fetchPost, staleTime: Infinity }, { queryKey: ['post', 2], queryFn: fetchPost, staleTime: Infinity }, ],})
Options
The useQueries
hook accepts an options object with a queries key whose value is an array with query option objects identical to the useQuery
hook (excluding the context
option).
context?: React.Context<QueryClient | undefined>
defaultContext
will be used.Having the same query key more than once in the array of query objects may cause some data to be shared between queries, e.g. when using
placeholderData
andselect
. To avoid this, consider de-duplicating the queries and map the results back to the desired structure.
Returns
The useQueries
hook returns an array with all the query results. The order returned is the same as the input order.
“This course is the best way to learn how to use React Query in real-world applications.”—Tanner LinsleyCheck it out