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 })
...
}