@hennge/vue3-pagination
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.17 • Public • Published

    Vue 3 Pagination

    A Vue 3 component for pagination.

    Table of Contents

    Demo

    Demo

    Installation

    Package is available on NPM: https://www.npmjs.com/package/vue3-pagination

    // with npm
    npm install @hennge/vue3-pagination
    // with yarn
    yarn add @hennge/vue3-pagination

    The component is packaged mainly for use with bundlers, if you require a browser build - post an issue.

    Getting Started

    Import component

    import VPagination from "@hennge/vue3-pagination";
    import "@hennge/vue3-pagination/dist/vue3-pagination.css";
    
    export default {
      ...
      components: {
        VPagination
      }
      ...
    }

    How to use

    <template>
      <v-pagination
        v-model="page"
        :pages="10"
        :range-size="1"
        active-color="#DCEDFF"
        @update:modelValue="updateHandler"
      />
    </template>

    Props and attributes

    Main interaction with the pagination is done via v-model with Number as expected type of the value passed.

    ID Type Default Description
    pages Number Total number of pages
    rangeSize Number 1 Number of page around the current page
    activeColor String #DCEDFF Background color of the current page
    hideFirstButton Boolean false Hide the button to go to the first page
    hideLastButton Boolean false Hide the button to go to the last page

    Events

    ID Output Description
    update:modelValue Number The current page has been updated

    License

    MIT

    Copyright © 2020 - Present, Julian Springaux

    Contact

    Install

    npm i @hennge/vue3-pagination

    DownloadsWeekly Downloads

    1,385

    Version

    1.0.17

    License

    MIT

    Unpacked Size

    39.4 kB

    Total Files

    15

    Last publish

    Collaborators

    • julian-springaux
    • taizo
    • hennge-henrylie