Layui數據表格 加入 自定義擴展方法(重新渲染Render當前頁數據)


具體開發中遇到的問題如下,

數據表格內的 內容 通過 table.cache["SampleList"] 修改后,重新渲染或重新加載會導致當前操作的分頁 和 配置被清空。我修改了第5頁第X行的X列值,重新渲染后就回到了最原始第1頁或重新調用了接口。

Layui 官方提供的文檔 提供的刷新表格方法有幾種

1 var obj = table.render({});//生成一個數據表格

1.obj.Reload (這個方法會根據初始化表格的Option {} ,重新調用接口加載一次)

2.Table.Render(這個無效果)

 ---------------------------------------------------- ---------------------------------------------------- ---------------------------------------------------- ----------------------------------------------------

需要達到的效果是:

不調用接口,僅僅只是從table.cache["表ID"] 當前頁緩存里重新渲染,

步驟:
1.將需要修改的列 值 使用table.cache["表ID"][“行索引”]["字段名"]=“xxxx” 進行修改

2.調用自己寫的擴展方法,重新渲染到當前頁界面。

 

這里需要修改 原生js  lib\layui\lay\modules\table.js

將下面的擴展方法代碼 加入到  lib\layui\lay\modules\table.js 里,原生js是壓縮了的,這里的demo 格式化了一下。

 

要加入的擴展方法代碼如下:

不壓縮:

YRRender: function(cache) {
                if (cache == undefined) {
                    console.error("cache參數為table.cache['表ID']");
                    return;
                }
                var s = {
                    data: cache
                };
                e.renderData(s, e.config.page.curr, e.config.page.limit, !0);
            }

 壓縮后:

YRRender: function (cache) { if (cache == undefined) { console.error("cache參數為table.cache['表ID']"); return; } var s = { data: cache }; e.renderData(s, e.config.page.curr, e.config.page.limit, !0); }

 

調用方法:

將要改的數據 table.cache["SampleList"] 里 進行修改后,

調用

obj.YRRender(table.cache["SampleList"]);//SampleList即 option 里 elem: '#SampleList' 屬性

效果圖:

這里我用js修改了cache里的數據,然后調了YRRender方法。分頁為改變,也未請求接口


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM