https://github.com/sinchang/vue-laypage

📃 A simple pagination component for Vue.js 2.x
https://github.com/sinchang/vue-laypage

component laypage pagination vue

Last synced: 15 days ago
JSON representation

📃 A simple pagination component for Vue.js 2.x

• Host: GitHub
• URL: https://github.com/sinchang/vue-laypage
• Owner: sinchang
• Created: 2017-02-09T12:28:42.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2019-09-02T08:56:05.000Z (over 5 years ago)
• Last Synced: 2024-12-23T04:47:33.723Z (20 days ago)
• Topics: component, laypage, pagination, vue
• Language: Vue
• Homepage: https://vue-laypage.netlify.com
• Size: 485 KB
• Stars: 26
• Watchers: 2
• Forks: 7
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-vue - vue-laypage - laypage?style=social) - 简单的VueJS分页组件 (UI组件)
• awesome-github-vue - vue-laypage - 简单的VueJS分页组件 (UI组件)
• awesome-github-vue - vue-laypage - 简单的VueJS分页组件 (UI组件)
• awesome - vue-laypage - 简单的VueJS分页组件 (UI组件)

README

        
## vue-laypage

> A simple pagination component for Vue.js, Based on [layPage](http://laypage.layui.com/)

[![NPM version](https://img.shields.io/npm/v/vue-laypage.svg?style=flat)](https://npmjs.com/package/vue-laypage) 

[![Vue 2.x](https://img.shields.io/badge/Vue-2.x-brightgreen.svg)](https://vuejs.org/v2/guide/)

[![NPM downloads](https://img.shields.io/npm/dm/vue-laypage.svg?style=flat)](https://npmjs.com/package/vue-laypage) 

## Installation and Use

```

$ npm install vue-laypage --save

```

```

import Laypage from 'vue-laypage'

import 'vue-laypage/vue-laypage.css'

export default {

  components: {

    Laypage

  }

}

```

or

```

import Vue from 'vue'

import Laypage from 'vue-laypage'

import 'vue-laypage/vue-laypage.css'

Vue.use(Laypage)

```

## Props

| Name | Type | Description |

| --- | --- | --- |

| pages | Number | 总页数，必填 |

| groups | Number | 一组显示几页，默认为5 |

| prev | String, Number, Boolean | 上一页按钮的文字，false 不显示 |

| next | String, Number, Boolean | 下一页按钮的文字，false 不显示 |

| first | String, Number, Boolean | 首页按钮的文字，false 不显示 |

| last | String, Number, Boolean | 尾页按钮的文字，false 不显示 |

| skin | String | 按钮高亮的颜色，默认#42b983 |

| skip | Boolean | 是否显示跳转 |

| jump | Function | 触发分页后的回调，返回当前页 |

## LICENSE

MIT