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

探索:回去對了一下官方文檔的例子,發現參數都對。那就看看兩個初始化屬性吧
- 此路不通換路走 :設置url不行,那就看看設置data屬性,結果發現可以實現正常分頁。
- 找到了可行的,對照行不通的url方法,於是我決定去table.js文件看看兩個方法有何不同
- 本着學習的態度,我把table.js這個壓縮文件展開成了日常熟悉的會換行的格式(注:一句一句按回車換的行)。 然后找到了“F.prototype.pullData” 這個初始化方法:發現了兩者最后都是調用“renderData
-
”方法,區別在於兩個方法在調用前對參數的處理上有不同
-
-
- 通過data參數的初始化方法有一句“data.concat().splice(s,a.limit),”通過設置的每頁行數limit與前面頁隱藏了的數據截取當前頁面需要的數據。如下圖:

- 通過url參數的初始化方法沒有這一步操作,傳的是全部的數據,這就導致了第一頁就顯示了所有數據,如下圖:

- 結論:是data參數初始化方法中對數據進行了加工截取處理使得分頁有效
- 通過data參數的初始化方法有一句“data.concat().splice(s,a.limit),”通過設置的每頁行數limit與前面頁隱藏了的數據截取當前頁面需要的數據。如下圖:
-
解決方法與思考:(1) 去迎合layui的設計,改變后台服務傳入的參數,使得“t.data”為當前頁的數據而非總的數據; (2) layui總是要完善的,就改他的代碼好了:將那個截取操作的代碼復制到url初始化方 法中。(3) 思考:為何他們能寫出源碼,而我看都覺得費勁?
