Skip to content


The pagination component helps users navigate through large lists of results by splitting them up into pages.

PropData typeRequired?Description
pagesNumberYesThe total number of pages to paginate.
v-model:pageNumberYesThe page number of the current page.

Pagination model

Create a pagination bar by passing the number of pages to the pages prop. Use v-model to sync the selected page to your page data. Users can click on each button or input a specific page and hit return.

<fw-pagination :pages="8" v-model:page="page" />