之前一直用layerPage做分页插件的 但是转vue后用layer总感觉怪怪的,所以仿照layer写了个vue组件 使用方法:
js
import pagination from '../../components/vue-pagination' //引入分页组件
export default {
components: {
pagination, //注册组件
},
data() {
return {
pageInfo:{
total:100, // 记录总条数 默认空,如果小于pageNum则组件不显示 类型Number
current:1, // 当前页数, 默认为1 类型Number
pagenum:10, // 每页显示条数,默认10 类型Number
pagegroup:5, // 分页条数 默认为5,需传入奇数 类型Number
skin:'#16a086' // 选中页码的颜色主题 默认为'#16a086' 类型String
}
}
},
methods:{
pagechange:function(current){ // 页码改变传入新的页码,此处做回调
console.log(current);
}
}
}
html
<pagination
:pageInfo="pageInfo"
@change="pagechange"
></pagination>