分页 - Pagination

c-pagination提供带有展示页码的分页组件，默认从第一页开始。

基础用法

通过 total 属性指定总条数，默认每页 20 条。

共1160条12 3 4⋯58

<c-pagination :total="1160" />

高级用法

span：当页码太多时，我们希望省略显示一部分页码，只显示当前页码前后的几个页码及起始和结束页码即可。span提供此功能，默认为3，即除了起始页码和结束页码，当前页码前后最多显示3个页码。

下面这个例子，是设置total=200、pn=13、ps=10、span=2时的显示

共200条1⋯11 12 13 14 15⋯20

<c-pagination :total="200" :pn="13" :ps="10" :span="2"></c-pagination>

事件

change：切换页面时，触发该事件。一般用来异步获取当前页数据。

共200条12 3 4⋯20

<c-pagination :total="200" :pn="pn" :ps="10" @change="getPageData"></c-pagination>

<script>
  export default {
    data() {
      return {
        pn: 1
      }
    },
    methods: {
      getPageData(pn) {
        this.pn = pn || 1;  //此处需要手动更新pn
        // Ajax 获取 pn 页的数据
        alert(`获取第${this.pn}页数据。`);
      }
    }
  }
</script>