Pagination start position for $prismic.api.query options?

Developing with Prismic
1

My first page has 7 documents while my subsequent pages all have 8 documents per page, forgive me if this exists but I can't see where I can specify the start position in my query.

Basically wanting to do:

    const document = await $prismic.api.query(
      $prismic.predicates.at('document.type', 'post'),
      {
        orderings: '[document.first_publication_date]',
        page: params.num,
        pageSize: 8,
        start: 7 (zero index i guess)
      }
    )

Thanks!

1 Like
3

Hello James,

Thanks for reaching out to us.

You need to set the page property to define what page of the API results to return, starting with and defaulting to 1. If you want to request to the second page of results then:

   const document = await $prismic.api.query(
      $prismic.predicates.at('document.type', 'post'),
      {
        orderings: '[document.first_publication_date]',
        pageSize: 8,
        page: 2
      }
    )

I hope it answers your question. Let me know if you have any further questions.

Thanks,
Priyanka

4

This only works if you have the same number of documents per page. If my first page has 7 documents but all subsequent pages have 8 documents, then once I reach my 2nd page, the cursor will be 1 document ahead and that document will be skipped.

The start position is used to tell the paginator where to begin and then paginates by whatever number of documents per page.

5

Hello @james0r

We don't have a start parameter with the prismicio/client package. You can try to add after parameter. The after parameter can be used along with the orderings option. Learn more about the after parameter in the Rest API documentation.

Thanks,
Priyanka

6

That's unfortunate. Using the REST API would then be fetching the articles on the client-side which i'm not wanting to do. Is there a way I can fetch my content at generate time using the REST API and Nuxt?

7

@james0r Yes you can use Nuxt async data or fetch hook to get the content:

Data fetching documentation of Nuxt: Nuxt - Data Fetching

Thanks,
Priyanka

10

This doesn't really address the pagination issue as far as I can tell. The issue is that there is no cursor to start the pagination count at a different starting point after the first page.

12

Hello @james0r

If you want to keep page size as 7, your second page will also have a page size of 7, and if there is one remaining result after the second page, it should come on the 3rd page.
You can use Graphql API as well for the same.

Thanks,
Priyanka

13

So in other words, having different number of items is not possible with prismic pagination, at least using the $prismic helper. Is this correct?

14

It's not possible directly, but I believe you can apply your logic based on page (which is actually page number) and total_results_size.
For example:

  1. if you have 22 total_results_size, you store the total_results_size, page and results_size in a static variable somewhere from the first query, the page will be 1, results_size will be 7, and total_results_size is 22.
  2. you are on the second time, check the static variable values and apply a maths logic to see what is the remaining results count, which is 15, more than results_size. trigger the same query from the first point, update the static variable of page.
  3. you are on the third time, check the static variable values and apply the same maths logic. If the remaining results are less than the result_size, then trigger another query with the updated result_size, which will be 8 here.

I haven't tried this but suggest some solution based upon my understanding. Give this a try and let me know.

Thanks,
Priyanka