前端假分页js一个函数搞定

pageTotal数组长度 // pageSize每页显示 10 条
this.pageNum第几页
paginationChange分页函数，所有数据在list中，pageData是分页数组，currentPageData是页面展示数据pageData[this.pageNum-1] 







分页函数和改变页数和size函数

更新数据和改变size时调用分页函数，改变页数时只改变当前页面数据值

// 分页查询
// pageTotal数组长度
// pageSize每页显示 10 条
paginationChange(){
  if (this.pageTotal<this.pageSize){
    this.currentPageData = this.list
  }else{
    this.pageData = []
    this.currentPageData = []
    let index = 0;
    for (let i = 0; i < this.pageTotal; i++) {
      if (i % this.pageSize === 0 && i !== 0) { // 可以被 10 整除
        this.pageData.push(this.list.slice(index, i));
        index = i;
      };
      if ((i + 1) === this.pageTotal) {
        this.pageData.push(this.list.slice(index, (i + 1)));
      }
    }
    this.currentPageData = this.pageData[this.pageNum-1]
  }

},
handleSizeChange(val) {
  //console.log(`每页 ${val} 条`);
  this.pageSize = val
  this.paginationChange()
},
handleCurrentChange(val) {
  //console.log(`当前页: ${val}`);
  this.pageNum = val
  this.currentPageData = this.pageData[this.pageNum-1]
},

 

调用

this.pageTotal = response.total
// this.pageTotal = Math.ceil(response.data.total/10);
//console.log(this.pageTotal)
this.list = response.rows
this.paginationChange() //分页