前端分页处理
最近经常遇到后端不能做分页处理,但是前端又需要分页查询的,emm。。。。一万只羊驼奔腾而过
flipOver () {
const pageSize = this.pageInfo.pageSize // 每页条数
const pageNo = this.pageInfo.pageNo // 当前页
const arr = this.tableList// 要分页的arr
var pagingNum = (pageNo- 1) * pageSize;
var newArr =
pagingNum + pageSize >= arr.length
? arr.slice(pagingNum , arr.length)
: arr.slice(pagingNum , pagingNum + pageSize);
this.detealis = newArr;
}
vue中在查询接口内调用一次这个方法后,后面再分页方法内调用就行了
async getDataList() {
// 获取列表信息
this.loading = true;
this.$API.onlineQueryPaybackHttp().then(result=>{
const pageResult = result.pageResult || {}
this.tableList= pageResult.records || []
this.pageInfo.total = this.tableList.length;
this.pageBreak()
this.loading = false;
}).catch(err=>{
this.loading = false;
})
currentChange(pageNo) {
this.pageNo = pageNo;
this.flipOver()
},