element 分页组件

uve页面

  <el-pagination
      background
      :page-size="5"
      :current-page.sync="pageNum"
      layout="prev, pager, next"
      :total="total*5"
      class="page"
      @current-change="handleCurrentChange"
    ></el-pagination>

<script>里面

 data() {
    return {
      loading: true,
      pageNum: 1, //初始页
      pagesize: 5, //    每页的数据
      bookList: [],
      total: ""
    };
  }

methods{
// 初始页currentPage、初始每页数据数pagesize和数据data
    handleCurrentChange: function(pageNum) {
      this.pageNum = pageNum; //点击第几页
      this.getList(pageNum);
    },
   //获取后台数据
    async getList(pageNum) {
      let url = "/book/getList";
      const res = await this.$http.get(url, {
        pageNum: pageNum
      });
      this.loading = false;
      this.bookList = res.books;
      this.total = res.totalPage;
    },
}