Return function to run useQuery?

[JamesBrightman]

The useMutation query has a function you can call to actually run the mutation. I use this to create myself a custom hook, eg/

....
const [mutatePostFile, {isLoading}] = useMutation(postUploadFile, {
        onSuccess: () => {successCallback()},
        onError: () => {errorCallback()}
    });

const postFile = useCallback((file: File, apiEnding: string) => {
    mutatePostFile({file: file, token: token, Url:url})
}, [mutatePostFile, APIUrl, token]);

return {
    postFile,
    isLoading
}

Calling postFile runs the mutation.

My question is, is there a way to do this with useQuery? There doesn't seem to be any return function to actually run the query, eg/

const [getX, {isLoading, error, data}] = useQuery(x,y); - this is invalid but is the behaviour I would like.

Thanks!

[TkDodo]

best way is probably:

• create local state for a boolean flag in your custom hook, initialize with false
• set the enabled prop to this
• expose the setter, so when you call it, you enable the query.

this will enable the query on calling the function the first time. react-query is declarative, not imperative, so if you really want to run a query only when some action is taken, you can keep it disabled at all times and run it with the returned refetch function. But I'd argue it's not idiomatic react-query :)

[JamesBrightman]

Thanks for the reply, hmm looks quite verbose. I was hoping there was something similar to Apollos 'useLazyQuery' but I'll give this a shot.

[jonathanstanley]

similar to #1549

[cjoecker]

I think also as @JamesBrightman that it makes sense to return the query function as it is done in the useMutation hook with the mutate parameter. Then both hooks would be consistent.