Pagination with react-apollo

apollo
1

I want to paginate with numbered pages.
I could I do that with react-apollo?

At moment I have two querys, one for fetch the total records count and another for fetch de details:

  query getPersons($start: Int, $limit: Int) {
    persons(start: $start, limit: $limit) {
      id
      name
      salary
    }
  }

  query getTotalPersons {
      totalpersons
  }

The totalpersons querys only returns an integer with the count of persons in the db. So If I didive the total count of persons by the amount of persons that I want to show by page, I can get the total pages.

So, my question is:
How can execute these querys in my component?
The total query only needs to run one time when my component load, and the details query needs to run (refetch) when I need another page to show. Must I use client.query for the first one and wrap my component with graphql (from react-apollo) for the second one?

2

You should use fetchMore: http://docs.apollostack.com/apollo-client/pagination.html

Basically, you do the total query first, with one page of data, then call fetchMore to get later pages.

2 Likes
3

Thank you @sashko it working now as you suggested!!

1 Like