接口因为数据过多，无法查询整表，无法给出数据总数，且需要页面分页的情况
1.pagination vue 展示
<el-pagination
class="table-pager"
@current-change="currentchange"
:current-page.sync="current"
:page-size="pagesize"
:total="total"
layout="prev,next">
</el-pagination>2.初始化值
- 分页组件的layout仅展示左右键按钮
- total值必填，先默认为pagesize
- current当前页码，默认1
- 使用当前页码变化触发分页事件
3.当前页码变化触发
- 修改页码前的当前页码数与每页数量的乘积是否已经大于计算的total值，如果大于则没有下一页
- 如果能进入下一页，则需要再更新一下total值，便于下一轮能进入下一页
- 如果current在获取数据的时候已经小于pagesize,，则表示没有更多信息，无须再进入下一页，即不需要更新total
- 简而言之，下一页的按钮是否能触发，取决于当前页的返回数据的长度是否等于pagesize，如果等于则需要把total再增加一个pagesize值。否则不增加，也不能再点击下一页。
currentchange(val){
if((this.current-1)*this.pagesize > this.total){
this.$message({
type:'warning',
message:`没有信息了`
})
this.current=val-1;
return
}
this.current=val;
this.getAccessLogs()
},
getAccessLogs(){
this.loading=true;
if(this.current==1){
this.total=this.pagesize
}
this.$apollo.query({
query: gqlreq.accessLogs,
variables:{
first:this.pagesize,
offset:((this.current-1)>=0)?(this.current-1)*this.pagesize:0
}
}).then(async (res) => {
this.loading=false;
if (res.data && res.data.accessLogs&& res.data.accessLogs) {
this.tabledata=commonjs.takeoffEdges(res.data, "accessLogs");
if((this.tabledata&&this.tabledata.length)){
if(!(this.tabledata.length<this.pagesize)){
this.total=(this.current+1)*this.pagesize
}
}else{
this.$message({
type:'warning',
message:`当前查询第${this.current}页，没有信息了`
})
}
}
}).catch((e)=>{
console.log('catch err',e)
this.loading=false;
})
},
