Fetch Data using the Apollo Query Component

InstructorNik Graf

Share this video with your friends

Send Tweet

In order to display data we first need to fetch it. The Query component allows us to describe which data we are interested and automatically handle the fetching of our data. Once we received the data we can render it using React. Since the Query component handles the data fetching we need to make sure we properly deal with the cases of a loading state as well as when the receive Errors from the GraphQL API. In this lesson we will cover both.

Free Community Resource

A Community Resource means that it’s free to access for all. The instructor of this lesson requested it to be open to the public.

Vlad
Vlad
~ 2 years ago

You query ID and title, then you have the data returned. Where is this data stored ? in json file ? would be nice to see also that step where you link data to graphql...

Nik Graf
Nik Graf(instructor)
~ 2 years ago

@Vlad it's storred in Apollo's In-Memory Cache. You can find more info here: https://www.apollographql.com/docs/react/advanced/caching.html

Eleonora Lester
Eleonora Lester
~ 2 years ago

Hey @Nik question in which case would we use <ApolloConsumer> then? Do we normally use Query and not ApolloConsumer?

Nik Graf
Nik Graf(instructor)
~ 2 years ago

Hey @Eleonore, apart from this example I have never used ApolloConsumer. I always used Query & Mutation.

There might be useful usecases, but so far I haven’t ran into them.