@saurssaurav/pagination-js-vue

Pagination Vue

Simple and light weight pagination for vue.

Installation

$ npm i @saurssaurav/pagination-js-vue

Usage

<script setup lang="ts">
import { ref } from 'vue';
import PaginationTest from '@saurssaurav/pagination-js-vue';
import '@saurssaurav/pagination-js-core/style.css'; // import default pagination css

const currentPage = ref(1);

const onChange = (page) => {
  currentPage.value = page;
};
</script>

<template>
  <pagination-test
    :totalPage=10
    :pageSidesToCurrentPage=2
    :currentPage="currentPage"
    @onChangeCurrentPage="onChange"
  ></pagination-test>
</template>

Props

Name	Type	Default	Description
totalSize	Number		Required. Total data size
currentPage	Number		Required. Active page number
onChangeCurrentPage	Function		Required. Page change handler. Receive current pageNumber as arg
pageSidesToCurrentPage	Number		Required. Neighbouring pages to active page