我在Vue做一个分页的内容，就是点击不同页码显示不同的内容，应该如何做呢？

Question

methods:{handleCurrentChange(val) {  console.log(`当前页: ${val}`);}}点击事件应该怎么写，把点击页码的id传给后台，再获得相关页码id的内容渲染到页面上呢？

Answer 1

 <el-pagination

  @size-change="handleSizeChange"

  @current-change="handleCurrentChange"

  :current-page.sync="currentPage"

  :page-size="pageSize"

  layout="total, prev, pager, next"

  :total="1000">

</el-pagination>

handleCurrentChange(val){

    this.currentPage = val

}

Answer 2

前端获取当前页码 page 和每页数量 pageSize 传给后端，后端会根据 page 和 pageSize 算出 Count，然后从 第 Count 个数据开始获取 pageSize 个数据传给前端，前端显示后端传过来的列表就行了。分页的逻辑大概就是这样。后端发送给前端列表数据之外，还要传一个 total ,就是所有的数量，好让前端计算显示总页面