useGraphQLQuery
useGraphQLQuery<
T>(queryKey,query,options?):UseQueryResult<NoInfer<T|undefined>,GraphQLError>
Hook to execute GraphQL queries with React Query caching
Type Parameters
Section titled “Type Parameters”| Type Parameter | Default type | Description |
|---|---|---|
T |
unknown |
The expected response data type |
Parameters
Section titled “Parameters”| Parameter | Type | Description |
|---|---|---|
queryKey |
string | readonly unknown[] |
Unique key for caching (string or array) |
query |
string |
The GraphQL query string |
options? |
UseGraphQLQueryOptions<T> |
Query options including variables |
Returns
Section titled “Returns”UseQueryResult<NoInfer<T | undefined>, GraphQLError>
React Query result object
Examples
Section titled “Examples”interface UsersQuery { users: Array<{ id: string; email: string }>}
function UsersList() { const { data, isLoading } = useGraphQLQuery<UsersQuery>( 'users', `query { users { id email } }` )
return <div>{data?.users.length} users</div>}// With variablesconst { data } = useGraphQLQuery<UserQuery>( ['user', userId], `query GetUser($id: ID!) { user(id: $id) { id email } }`, { variables: { id: userId } })