LKT Paginator

LKT Paginator is a library for automatically load result pages from an HTTP API.

Requirements

• Work with LKT HTTP Client resources.

Installation

With npm

npm i -S lkt-paginator

Load into your Vue App:

import {createApp} from "vue";
import LktPaginator from 'lkt-paginator';

const app = createApp({});

app.use(LktPaginator);

// Alternatively, load updating button texts:
app.use(LktPaginator, {
    firstButtonName: 'First', // Default value
    prevButtonName: 'Prev', // Default value
    nextButtonName: 'Next', // Default value
    latestButtonName: 'Last' // Default value
});

Usage

export default {
    name: "YourComponent", 
    inheritAttrs: false,
    data() {
        return {
            page: 1,
            filters: {
                name: 'john'
            }
        }
    }
}

<lkt-paginator v-model="page" :filters="filters" resource="get-results-resource"></lkt-paginator>

Props

v-model

• Type: Integer

Current page number.

filters

• Type: Object

Object keys will be passed as arguments to the resource.

resource

• Type: String

The resource name to be called.

palette

• Type: String

A palette name. It will add a new css selector, so you easily can have multiple styles.

readOnly

• Type: Boolean

If true, the paginator won't perform any HTTP call.

Stylesheet

This package includes one pure CSS stylesheet.