layui分頁功能使用——點頁碼再查詢


在使用layui的分頁功能時產生了一個誤區,最開始我寫成了用Ajax去請求數據庫信息,然后再在成功返回的代碼中使用layui的分頁

1 Ajax{
2     ......
3     ......
4     success:function(res){
5         laypage.render({
6           //使用返回的數據設置參數
7         })  
8     }  
9 }    

這樣會產生一個嚴重的問題,就是會先把數據查了再分頁,而不是查看下一頁,或跳轉指定頁再去查詢數據庫,當數據庫中的記錄太多的時候會導致頁面卡頓,等待數據返回

為了解決這個問題,改用另外的方式寫:

var table = layui.table;
  table.render({
    elem:'#tableDiv',//要顯示位置元素的id
    url:'query/searchList',//查詢數據的路徑
    request:{
        pageNum:'currPage',//頁碼的參數名稱,默認:page
        limitName:'pageSize'//每頁顯示數據條數的參數名,默認:limit
    },
    where{
        //其余要傳的參數
    },
    limit:10,
    done:function(res,curr,count){
        //如果是異步請求數據的方式,res即為你接口返回的信息
        //如果是直接賦值的方式,res為:{data:[],count:99};data為當前數據頁數,count為數據總長度
    }
  })

這樣就可以正確的分頁

 


免責聲明!

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



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