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;
    },
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容