1.0.0 • Published 5 years ago

shapla-data-table-pagination v1.0.0

Weekly downloads
5
License
MIT
Repository
github
Last release
5 years ago

shapla-data-table-pagination

A simple pagination based on WordPress list table pagination specially for data table.

Table of contents

Installation

npm install --save shapla-data-table-pagination

Usage

Add the component:

import pagination from 'shapla-data-table-pagination';

export default {
  name: 'Hello',

  components: {
    pagination
  },
  
  methods: {
    paginate(){
      // Handle pagination event
    }
  }
}
<pagination @pagination="paginate"></pagination>

Props

PropertyTypeRequiredDefaultDescription
total_itemsNumberYes0Total number of items.
per_pageNumberYes20Number of items to show per page.
current_pageNumberYes1Current page number.
sizeStringNodefaultPagination button size. Value can be default, small, medium, large
textNameStringNoitemsPlural name of item.
textNameSingularStringNoitemSingular name of item.
textCurrentPageStringNoCurrent PageScreen reader text for current page.
textFirstPageStringNoFirst PageScreen reader text for first page.
textPreviousPageStringNoPrevious PageScreen reader text for previous page.
textNextPageStringNoNext PageScreen reader text for next page.
textLastPageStringNoLast PageScreen reader text for last page.
textOfStringNoofScreen reader text for 'of' text.

Listeners

The pagination component fires the following events:

pagination: When any navigation icon is clicked, it fires the event and it gives current page number.

<!-- template -->
<pagination @pagination="close"></pagination>


<!-- method -->
methods: {
  paginate(page){
    // Handle click event
  }
}
1.0.0

5 years ago