前端之家收集整理的这篇文章主要介绍了
vue.js表格分页示例，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
分页一般和表格一起用，分页链接作为表格的一部分，将分页链接封装成一个独立的组件，然后作为子组件嵌入到表格组件中，这样比较合理。
效果：
代码：
1.注册一个组件
js
this.all ) { right = this.all}
while (left <= right){
list.push(left);
left ++;
}
return list;
},showLast: function(){
return this.cur != this.all;
},showFirst: function(){
return this.cur != 1;
}
}
});
模板：
HTML：
分页参数
pageAll:0,//总页数,根据服务端返回total值计算
perPage:10 //每页
数量
},methods: {
loadList:function(page){
var that = this;
$.ajax({
url : "/getList",type:"post",data:{"page":page,"perPage":this.perPage},dataType:"json",error:function(){alert('请求列表失败')},success:function(res){
if (res.status == 1) {
that.items = res.data.list;
that.perPage = res.data.perPage;
that.pageAll = Math.round(res.data.total / that.perPage);//计算总页数
}
}
});
},//初始化
init:function(){
this.loadList(1);
}
}
});
vm.init();
