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這個參數,後來才知道是要自己寫入具體的參數

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章