实现该代码的页号跳转 page: true , limits: [10, 15, 20] //一页选择显示3,5或10条数据 , limit: 10 //一页显示10条数据 , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据,res为从url中get到的数据 var result; console.log(this); console.log(JSON.stringify(res)); if (this.page.curr) { result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr); } else { result = res.data.slice(0, this.limit); } return { "code": res.code, //解析接口状态 "msg": res.msg, //解析提示文本 "count": res.count, //解析数据长度 "data": result //解析数据列表 }; }
时间: 2023-06-15 21:05:37 浏览: 119
ShowPage 显示“上一页 下一页”等信息的封装代码
这是一个基于layui框架的数据表格代码,其中包括了分页、每页显示条数和数据解析等功能。
具体实现过程如下:
1. 设置分页参数
page: true, //开启分页
limits: [10, 15, 20], //一页选择显示3,5或10条数据
limit: 10 //一页显示10条数据
这里设置了开启分页功能,并且每页可以选择显示10、15、20条数据,同时一页默认显示10条数据。
2. 解析数据
parseData: function (res) { //将原始数据解析成 table 组件所规定的数据,res为从url中get到的数据
var result;
console.log(this);
console.log(JSON.stringify(res));
if (this.page.curr) {
result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
}
else {
result = res.data.slice(0, this.limit);
}
return {
"code": res.code, //解析接口状态
"msg": res.msg, //解析提示文本
"count": res.count, //解析数据长度
"data": result //解析数据列表
};
}
这里使用了parseData函数将从url中获取到的数据进行解析,并将解析后的数据返回给table组件进行显示。具体解析过程如下:
首先判断当前页数是否存在,如果存在则根据当前页数和每页显示的条数来截取数据,否则默认显示前10条数据。
然后将解析后的数据封装成一个对象,包括接口状态、提示文本、数据长度和数据列表等信息。
最后将封装好的数据返回给table组件进行显示。
以上就是该代码实现页号跳转、每页显示条数和数据解析的具体过程。
阅读全文