接口因为数据过多,无法查询整表,无法给出数据总数,且需要页面分页的情况
1.pagination vue 展示
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{
console.log('catch err',e)
this.loading=false;
})
},
服务器托管,北京服务器托管,服务器租用 http://www.fwqtg.net
相关推荐: MySQL笔记十一之update更新和delete更新操作
本文首发于公众号:Hunter后端 原文链接:MySQL笔记十一之update更新和delete更新操作 这一篇笔记介绍表的更新和删除操作: UPDATE 和 DELETE。 在介绍之前,说明一点:慎用!慎用!!慎用!!! 一定要对这两个语法慎用,一定要加上限…