Pagination

A pagination is a structured set of data made up of rows and columns (tabular data). A pagination allows you to quickly and easily look up values that indicate some kind of connection between different types of data

Examples

Code

<script setup lang="ts">
import { ref } from 'vue'

const pagination = ref({
  page: 1,
  page_size: 5,
  total_document: 100
})

const updateData = () => {}
</script>

<template>
  <Demo>
    <base-pagination
      v-model="pagination.page"
      :page-size="pagination.page_size"
      :totalDocument="pagination.total_document"
      @update:model-value="updateData()"
    />
  </Demo>
</template>

Pagination API

Props

Name	Type	Default	Description
v-model	number		Page number is required.
page-size	number		Page size is required.
total-document	number		Total document is required.
max-button	number	5	Number of max buttons show.

Event

@update:model-value event for choosen page