Docs
Purchase now

Pagination

Documentation and examples for showing pagination to indicate a series of related content exists across multiple pages.

Examples 

<div>
  <base-pagination :page-count="10" v-model="pagination.default"></base-pagination>
</div>
<script>
export default {
  data() {
    return {
      pagination: {
        default: 1
      }
    };
  }
};
</script>
Show Code

Sizing

Fancy larger or smaller pagination? Add size="lg" or size="sm" for additional sizes 

<base-pagination :page-count="10" size="lg"></base-pagination>
Show Code 
<div>
  <base-pagination :page-count="10" size="sm"></base-pagination>
</div>
Show Code

Alignment

Change alignment with the help of align prop. It uses flexbox under the hood. 

<div>
  <base-pagination :page-count="10" align="center"></base-pagination>
</div>
Show Code

Props

← Popovers →