pagination-vue-simple v1.1.1

pagination-vue-simple

一个简单的原生自定义vue分页插件。

1.1.0 版本更新说明：

1.新增自定义页码被激活颜色theme-color的功能，并兼容ie9及其以上 2.对属性说明部分参数写法进行修正，使其与完整示例里的写法一致 3.新增效果图展示

安装

npm install pagination-vue-simple --save

初始化 在main.js中全局引入

import Vue from 'vue'
import PaginationVueSimple from 'pagination-vue-simple'

Vue.use(PaginationVueSimple)

最简示例

<template>
  <div id="app">
    <pagination-vue-simple 
        :total="80" 
        @current-change-page="getPage">
    </pagination-vue-simple>
  </div>
</template>

<script>
export default {
  name: 'app',
  data(){
    return {
      page: 1
    }
  },
  methods:{
    getPage(page){
      this.page = page
    }
  }
}
</script>

完整示例

<template>
  <div id="app">
    <pagination-vue-simple 
        :type="'sm'" 
        :total="80" 
        :limit="10" 
        :max-show="5" 
        :is-show-total-page="false" 
        :p-position="'left'"
        :theme-color="'green'"
        @current-change-page="getPage">
    </pagination-vue-simple>
  </div>
</template>

<script>
export default {
  name: 'app',
  data(){
    return {
      page: 1
    }
  },
  methods:{
    getPage(page){
      this.page = page
    }
  }
}
</script>

属性

事件