Pagination

Usage

Utilise with v-model to make the current page reactive. Pass a number to the num-pages prop to indicate the total number of pages available.

      <script lang="ts" setup>
const pageNum = ref(2)
</script>

<template>
  <CPagination
    v-model="pageNum"
    :num-pages="7"
  />
</template>

    

Hide numbers

This boolean prop will hide the page numbers if provided and solely display next/prev page toggles.

      <template>
  <CPagination hide-nums v-model="value" />
</template>

    

Props