element 分页组件的使用

page-size:每页的条数
current-page：当前的页数
page-sizes：每页显示个数选择器的选项设置
@size-change:每页条数 pageSize发生改变时触发
@current-change：当前页

  <el-pagination
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
    :current-page="pageNum"
    :page-sizes="[20, 40, 60, 80]"
    :page-size="pageSize"
    layout="total, sizes, prev, pager, next, jumper"
    :total="pageTotal"
  ></el-pagination>

在data里面声明一下pageNum，pageSize，pageTotal

  pageNum: 1,
  pageSize: 20 //初始每页条数为20条
  pageTotal:100 //总页数

方法

   //每页条数
    handleSizeChange(val) {
      let self = this;
      self.pageNum = 1;
      self.pageSize = val;
      self.getList();
    },
    //当前页
    handleCurrentChange(val) {
      let self = this;
      self.pageNum = val;
      self.pageSize = 20;
      self.getList();
    }