zoukankan      html  css  js  c++  java
  • 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这个参数,后来才知道是要自己写入具体的参数

  • 相关阅读:
    tomcat配置http、https同时访问
    mycat 多库分表 单库分表(根据uuid)
    分页关联查询时 出现查出数据和条数不匹配 级联查询
    微信公众号转发网页
    maven导出jar包
    sqlserver分割字符
    mysql按字符分割字段排序
    对ajax中数据的得到以及绑定的认识
    对待事情应该有的态度!!!
    对Dom的认识
  • 原文地址:https://www.cnblogs.com/moppet/p/14717386.html
Copyright © 2011-2022 走看看