分頁往往是依附於資料表格的，所以我們就使用的是easyui的treegrid元件，來開啟pagination分頁元件，為了方便，我們使用JS實現。

表格顯示初始化

<!-- fitColumns="true" 自適應寬度 -->
<table id="myTable" fitColumns="true"></table>

<script>
		$(function () {
			
			$('#myTable').treegrid({    
			    url:'/category/position/Test',    
			    idField:'id',    
			    treeField:'region',
			    method:'GET',
				pagination:true, 			// 開啟分頁配置 
			    singleSelect:false,
			    columns:[[   
			    	{field:'checkbox',checkbox:'true'},
			        {title:'編號',field:'id',width:200,align:'center'},
			        {title:'職位名稱',field:'region',width:1044},    
			        {title:'職位排序',field:'sortNumber',width:200,align:'center',sortable: true}
			    ]]
			})
			
			  var p = $('#myTable').treegrid('getPager');
				$(p).pagination({
					pageSiez:10,// 每頁顯示的記錄條數 ，預設是10
					pageList:[1,10,15,20],// 可以設定每頁記錄條數的列表
					beforePageText:'第',  // 頁數文字框前顯示的漢字
					afterPageText:'頁  共{pages}頁',
					displayMsg:'當前顯示 {from} - {to} 條記錄  共  {total} 條記錄'
				})
		})
	</script>
 

效果圖

分頁分兩種

• 假分頁
           假分頁就是將所有要顯示的資料全部查詢出來後，進行前臺的分頁，適合資料量較小的Web專案。

• 真分頁
           真分頁相對假分頁來說麻煩了一些，但是對於資料量大的系統來說，可以很好的，快速的查詢資料。要想實現分頁，我們就得先知道分頁的原理，首先我們需要將[第幾頁(page)]和[一頁多少資料(rows)]傳遞給後臺，以便查詢，EasyUI非常方便的給我們提供了自動將這兩個引數傳到後臺的事件，當我們剛開始載入資料的時候，我們可以看到如圖，
  

  
  這裡用的就是真分頁，根據前臺傳過來的page和rows查詢資料
  
  
  然後後臺根據前臺傳過來的當前頁和每頁顯示的資料去資料庫分頁查詢出資料並返回到前臺去就行了
  注意這裡拿Result結果集返回,需要返回的資料有total（總資料）級rows（資料來源）

			@ResponseBody
			@GetMapping("/Test")
			private Result Test(Integer page,Integer rows){ // 後臺接收前臺傳過來的資料
				// 然後轉service層，作各種資料判斷
				// 這裡就不寫了，各位看官自行摸索吧
			｝

public class Result {
	private int code=0;
	private String msg;
	private int total;
	private Object obj; 
	private List rows;
}