jq easyui資料網路的分頁過程

第一次寫技術方面的文章，有點忐忑，總怕自己講的不對誤導別人。但是萬事總有個開頭，有不足錯誤之處，請各位讀者老爺指出。

言歸正傳，最近剛進新公司，上頭要求我先熟悉熟悉easyui這個元件庫。在涉及到datagrid元件的分頁功能時，遇到了一點問題。

我們在處理分頁時，通常有兩種方式，前端分頁和後台分頁。前端分頁會將後台資料一次性全部查詢返回，然後在前端儲存處理。這樣的方式缺點很明顯，如果資料量非常大，儲存在前端顯然是一種非常不明智的方式，對於效能有明顯影響。

那我們來看看easyui處理分頁的方式。

姓名學號學校專業操作

以上是頁面上的**，當設定pagination屬性為true時，easyui會自動加上乙個分頁器。這個分頁器，當頁面載入或者是使用者改變當前頁面時，easyui會以ajax的方式傳送給後台兩個引數:page和row。page是指當前頁碼，row指一頁顯示多少條資訊。

我們這邊用nodejs搭建乙個簡單的web伺服器，來看看後台是怎麼進行分頁的。定義乙個json物件，模擬一下資料庫裡的資料。由於資料較多，這邊不予展示。當easyui傳送請求過來時，我們先獲取它帶的引數，這兩個引數是以query方式帶過來的。

var page = req.query.page;//page當前頁
var row = req.query.rows;//頁面最多幾條
var start = (page-1)*row;//查詢起始位置
var end = page*row-1;//查詢結束位置

根據拿到的page和row兩個值確定該頁面返回的資料。返回的資料必須是符合easyui要求的json資料，格式如下:

必須帶有total屬性，屬性值為總共的資料條數，returnarray是這一頁的資料內容，以陣列物件的形式返回。返回前端後，easyui會自動幫你把資料填充。這樣一來，我們就理解了這個分頁的原理。

但是問題來了，easyui每一次改變當前頁碼，都會向後台發起一次請求。我們知道，在web專案中，大量的http請求會影響效能，easyui如此頻繁的請求操作，是不是也值得商榷呢？這也導致了大量的重複對資料庫的查詢操作，因為我們要根據頁碼來獲取不同區間的資料集。