layui table 表格兩種賦值方式下,data分頁效果有效, url分頁效果的失效 問題的解決。


問題描述:在換用ayui  table 來整體化項目表格時,發現設置url參數調用后台服務來賦值表格信息時會無視分頁,直接全部顯示:結果如下圖。可見全部數據都顯示出來了,連滾動條都出來了,絲毫沒 有理會分頁信息與code的良苦用心。
                                                                                                                                                                                                                                                                                                                                                     

探索:回去對了一下官方文檔的例子,發現參數都對。那就看看兩個初始化屬性吧

    1. 此路不通換路走 :設置url不行,那就看看設置data屬性,結果發現可以實現正常分頁。
    2. 找到了可行的,對照行不通的url方法,於是我決定去table.js文件看看兩個方法有何不同
    3. 本着學習的態度,我把table.js這個壓縮文件展開成了日常熟悉的會換行的格式(注:一句一句按回車換的行)。
    4. 然后找到了“F.prototype.pullData” 這個初始化方法:發現了兩者最后都是調用“renderData
                 ”方法,區別在於兩個方法在調用前對參數的處理上有不同
      1. 通過data參數的初始化方法有一句“data.concat().splice(s,a.limit),”通過設置的每頁行數limit與前面頁隱藏了的數據截取當前頁面需要的數據。如下圖:                                                               
      2. 通過url參數的初始化方法沒有這一步操作,傳的是全部的數據,這就導致了第一頁就顯示了所有數據,如下圖:                                                                                                                    
      3. 結論:是data參數初始化方法中對數據進行了加工截取處理使得分頁有效

解決方法與思考:(1) 去迎合layui的設計,改變后台服務傳入的參數,使得“t.data”為當前頁的數據而非總的數據; (2) layui總是要完善的,就改他的代碼好了:將那個截取操作的代碼復制到url初始化方 法中。(3) 思考:為何他們能寫出源碼,而我看都覺得費勁?



免責聲明!

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



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