Docs
Download

# 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 →