usePrefetchQuery

usePrefetchQuery(query, options)(filters)

usePrefetchQuery Hook to connect GraphQL data to React component and automatically fetch the data on Component mount. This Hook will also automatically abort request on Component unmount in case request is still pending

It has same API as useQuery

dogs.graphql
query Dogs {
dogs {
id
breed
}
}
import DOGS from './dogs.graphql'
import { usePrefetchQuery } from '@cranium/resource'
function Dogs(){
const { request, data, isLoading, errors, filters } = usePrefetchQuery(DOGS)({})
...
}
query Dogs ($first: Int, $cursor: String ) {
dogs {
edges {
node {
id
breed
}
}
}
}
import DOGS from './dogs.graphql'
import { usePrefetchQuery } from '@cranium/resource'
function Dogs(){
const { request, data, isLoading, errors, filters } = usePrefetchQuery(DOGS, {
parseValue: 'data.dogs'
})({ first: 16 })
...
}