What is the difference between useQuery and useLazyQuery in Apollo graphQL?

Question

I was going through the documentation of Apollo React hooks.

And saw there are two queries hooks to use for which is useQuery and useLazyQuery

I was reading this page. https://www.apollographql.com/docs/react/api/react/hooks/

Can someone explain me what is the difference between them and in which case it should be used.

Answer 1

When useQuery is called by the component, it triggers the query subsequently.

But when useLazyQuery is called, it does not trigger the query subsequently, and instead return a function that can be used to trigger the query manually. It is explained on this page: https://www.apollographql.com/docs/react/data/queries/#manual-execution-with-uselazyquery

When React mounts and renders a component that calls the useQuery hook, Apollo Client automatically executes the specified query. But what if you want to execute a query in response to a different event, such as a user clicking a button? The useLazyQuery hook is perfect for executing queries in response to events other than component rendering. This hook acts just like useQuery, with one key exception: when useLazyQuery is called, it does not immediately execute its associated query. Instead, it returns a function in its result tuple that you can call whenever you're ready to execute the query.