layui 数据表格parseData方法手动将数据切片分页

可以先利用layui table中的parseData方法手动将数据切片分页,代码如下,要点是parseData: function(res){}中的方法,对从url中get到的数据进行手动分页处理。

table.reload ('jurisdiction', {
            method: 'get',
            url: '{SITE_URL}man.php?c=Home_basic_appmanage&m=auth_manage_edit'
            ,page: {
                curr: 1
            } //重新从第 1 页开始
            ,limit: '10'
            ,parseData: function (res) {
                /*console.log('默认刷新页');
                console.log(res);*/
                let result;
                let table_data = [];
                if (res.data.list) {
                    for (let i = 0; i < res.data.list.length; i++) {
                        table_data.push({
                            "id":res.data.list[i].id,
                            "dirname":res.data.list[i].dirname,
                            "name":res.data.list[i].name,
                            "read":res.data.list[i].read,
                            "write":res.data.list[i].write
                        });
                    }
                };
                if (this.page.curr) {
                    result = table_data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                } else {
                    result = table_data.slice(0, this.limit);
                };
                return {
                    "code": 0,
                    "msg": '', //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": result //解析数据列表
                };
            }
            ,where: {
                search: demoReload.val(),
                id: {$id}
            }
        });

我这里的获取数据的格式不同:res.data.list打印出来后就是获取到的数据数组。这里有个位置是一定要写的;那就是page里面的参数curr。


如果你获取不到page.curr参数改成

page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
,curr: 1 //设定初始在第 1 页
,groups: 1 //只显示 1 个连续页码
,first: false //不显示首页
,last: false //不显示尾页
}

 

分页可以由前端写(手动切割),也可以后端分段传数据过来;我是想用前端来解决这个问题。现在问题解决好了~~~

 

 

参考这个网址;https://blog.csdn.net/qq_35077107/article/details/101168088
但是我再使用的过程中一直无法获取到this.page.curr这个参数,后来才知道是要自己写入具体的参数

posted @ 2021-04-29 11:48  moppet蔡蔡  阅读(2016)  评论(0编辑  收藏  举报