# l-pagination

> Demo [Pagination-Plugin](https://vue-pagination-plugin.vercel.app/) # Properties

Latest version **0.2.1** (published 2021-10-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install l-pagination
pnpm add l-pagination
yarn add l-pagination
bun add l-pagination
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.1 |
| Published | 2021-10-07 |
| First published | 2021-10-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 416.3 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Lütfi Kotan |
| Maintainers | lkotan |

## Links

- npm: https://www.npmjs.com/package/l-pagination
- Repository: https://github.com/lkotan/vue-pagination-plugin
- Homepage: https://github.com/lkotan/vue-pagination-plugin#readme
- Issues: https://github.com/lkotan/vue-pagination-plugin/issues
- npm.io page: https://npm.io/package/l-pagination

## Dependencies (2)

- [vue](https://npm.io/package/vue.md) ^2.6.11
- [core-js](https://npm.io/package/core-js.md) ^3.6.5

## Recent versions

- 0.2.1 (latest) — 2021-10-07
- 0.2.0 — 2021-10-07
- 0.1.9 — 2021-10-07
- 0.1.8 — 2021-10-07
- 0.1.7 — 2021-10-06
- 0.1.6 — 2021-10-06
- 0.1.5 — 2021-10-06
- 0.1.4 — 2021-10-06
- 0.1.3 — 2021-10-06
- 0.1.2 — 2021-10-06
- 0.0.1 — 2021-10-06
- 0.1.1 — 2021-10-06
- 0.1.0 — 2021-10-06

## README

# pagination

Demo [Pagination-Plugin](https://vue-pagination-plugin.vercel.app/)
# Properties


| Property    | Type    | Default | Required | Description                                    |
|-------------|---------|---------|----------|------------------------------------------------|
| totalPage   | Number  |         | True     | Total number of rows in the dataset            |
| perPage     | Number  |         | True     | Number of rows per page                        |
| initialPage | Number  |         | True     | Number of rows initial page                    |
| pills       | Boolean | False   | False    | Applies pill styling to the pagination buttons |
| size        | String  | md      | False    | Size of the rendered buttons                   |
| pageRange   | Number  | 3       | False    | Range of pages which displayed                 |
| breakText   | String  | ...     | False    | Text for the break view indicator              |
| marginPage  | Number  | 2       | False    | The number of displayed pages for margins      |

# Vue

```bash
data() {
    return {
            currentPage: 1,
            perPage: 3,
            totalPage: 0,
            pills: false,
            size: "md",
            pageRange: 3,
            marginPages: 2,
            breakText: "...",
        };
},
methods: {
    changePage(page) {
        this.currentPage = page;
    }
}
```
# Props
```bash
    <Pagination
      :totalPage="totalPage"
      :perPage="perPage"
      :initialPage="currentPage"
      @changePage="changePage"
      :pills="pills"
      :size="size"
      :pageRange="pageRange"
      :breakText="breakText"
      :marginPages="marginPages"
    />
```
# Emit

```bash
<Pagination @changePage="changePage"/>
```


## Project setup

```
npm install
```

### Compiles and hot-reloads for development

```
npm run serve
```

### Compiles and minifies for production

```
npm run build
```

### Lints and fixes files

```
npm run lint
```

### Customize configuration

See [Configuration Reference](https://cli.vuejs.org/config/).

---
_Source: https://npm.io/package/l-pagination · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._