layui table.render 将翻页参数limit 和 page 赋值给pageNo,pageSize
时间: 2024-02-03 08:04:40 浏览: 811
layui 简单实现 TABLE 分页功能
在 layui 中,table.render() 方法会将表格数据渲染到页面上,同时还会初始化分页参数。其中,limit 和 page 是用于控制分页的参数,而 pageNo 和 pageSize 则是作为请求后端数据的参数。
具体来说,当用户在页面上点击下一页或者改变每页显示条数时,layui 会重新调用 table.render() 方法,并将新的 limit 和 page 参数传递给后端。而后端则需要根据这些参数来查询相应的数据,并返回给前端。
在 layui 中,可以通过监听 table.on('pageChange', function(obj){...}) 事件来获取分页参数的变化,并将其赋值给 pageNo 和 pageSize。具体代码如下:
```javascript
table.render({
// ...
page: true,
limit: 10,
parseData: function(res) {
// 获取数据并计算总页数
var data = res.data;
var count = res.count;
var pages = Math.ceil(count / this.limit);
// 将分页参数赋值给 pageNo 和 pageSize
this.pageNo = res.page;
this.pageSize = res.limit;
// 返回格式化后的数据
return {
code: res.code,
msg: res.msg,
count: count,
pages: pages,
data: data
};
}
});
// 监听分页参数变化事件
table.on('pageChange', function(obj){
var pageNo = obj.curr;
var pageSize = obj.limit;
// TODO: 根据新的分页参数发送请求并更新表格数据
});
```
其中,this.limit 表示当前每页显示的条数,res.page 表示当前页码,res.limit 表示每页显示的条数。在 parseData 回调函数中,我们可以将这些参数赋值给 pageNo 和 pageSize,以便后续使用。同时,我们还可以监听 table.on('pageChange', function(obj){...}) 事件,获取新的分页参数,并根据这些参数发送请求并更新表格数据。
阅读全文