Springboot 整合通用mapper和pagehelper展示分頁資料(附github原始碼)

jeremylai發表於2021-09-06

簡介

springboot

設計目的就是為了加速開發,減少xml的配置。如果你不想寫配置檔案只需要在配置檔案新增相對應的配置就能快速的啟動的程式。

通用mapp

通用mapper只支援對單表的操作,對單表的增刪改查,無需在mapper.xml寫對應的sql語句,只需要我們呼叫相應的介面即可。

pagehelp

pagehelper主要是在對查詢的資料進行一個分頁查詢。

  1. 首先在maven專案,在pom.xml中引入mapper和pagehelper的依賴
<!-- pagehelp -->
<dependency>
  <groupId>com.github.pagehelper</groupId>
  <artifactId>pagehelper-spring-boot-starter</artifactId>
  <version>1.2.3</version>
</dependency>
<!-- 通用mapper -->
<dependency>
  <groupId>tk.mybatis</groupId>
  <artifactId>mapper-spring-boot-starter</artifactId>
  <version>1.0.0</version>
</dependency>

2 新建一個mymapper.java檔案,繼承mapper介面

public interface MyMapper<T> extends Mapper<T>, MySqlMapper<T>,ConditionMapper<T> {
  //FIXME 特別注意,該介面不能被掃描到,否則會出錯
}

這個java檔案不能和其它mapper放在一起,以免被掃描到。獲取單表資料的操作都直接呼叫這個方法。

3 在配置檔案上新增以後屬性欄位

#jdbc
spring.datasource.url=jdbc:mysql://127.0.0.1:3306/news
spring.datasource.username=資料庫使用者名稱
spring.datasource.password=資料庫密碼
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
spring.freemarker.request-context-attribute=request

#mapper  
mapper.mappers=com.imooc.springboot.mapper.util.MyMapper
mapper.not-empty=false
mapper.identity=MYSQL

#pagehelper
pagehelper.helper-dialect = mysql
pagehelper.reasonable = true
pagehelper.support-methods-arguments = true
pagehelper.params= count= countSql

上面的配置mapper.mappers 是第2步裡面檔案所在的路徑。

4 新增了controller檔案之後,由controller裡面的方法去呼叫server裡面的方法。雖然是有通用mapper方法,但是每次新增一個server方法之後都要新增對應的mapper方法,這樣開發的也顯得比較繁瑣,所以我們需要一個通用server類,用這個類去呼叫第二步的方法就可以了。

public interface BaseService<T> {
       /**
	* 查詢所有
	 * 
	 * @return 返回所有資料
	 */
	List<T> findAll();

	/**
	 * 新增
	 * 
	 * @param t   實體
	 *          
	 * @return
	 */
	int save(T t);

	/**
	 * 修改
	 * 
	 * @param t
	 *            實體
	 * @return
	 */
	int updateByPrimaryKey(T t);

	/**
	 * 根據主鍵刪除
	 * 
	 * @param t   主鍵
	 *            
	 * @return
	 */
	int deleteByPrimaryKey(int t);
	
	/**
	 * 查詢表格列表
	 * @param t 分頁引數
	 * @return
	 */
	TableData<T> getTableData(PageBean pageBean);
}

上面只是封裝基本增刪改查的方法,後續可自行新增方法。
然後新增實現類

public abstract class BaseServiceImpl<T> implements BaseService<T> {
	@Autowired
	protected MyMapper<T> mapper;

	@Override
	public List<T> findAll() {
		return mapper.selectAll();
	}

	@Override
	public int save(T t) {
		return mapper.insert(t);
	}

	@Override
	public int updateByPrimaryKey(T t) {
		return mapper.updateByPrimaryKey(t);
	}

	@Override
	public int deleteByPrimaryKey(int t) {
		return mapper.deleteByPrimaryKey(t);
	}

	@Override
	public TableData<T> getTableData(PageBean bean) {
		int count = mapper.selectAll().size();
		if (count > 0) {
			PageHelper.startPage((bean.getOffset()/bean.getLimit()) + 1, bean.getLimit());
			List<T> list = this.findAll();
			return TableData.bulid(count, list);
		}

		return TableData.empty();
	}
}

注意:我用的編輯器是eclipse,如果用idea編輯器,這裡可把abstract去掉。

然後新增對應的介面和實現類繼承上面的介面和方法就可以了,比如新增一個newsserver 介面和newsserverImpl類

public interface NewsService extends BaseService<SysUser> {

}
@Service
public class NewsServiceImpl extends BaseServiceImpl<SysUser> implements NewsService{

}

5 為了減少資料庫伺服器的壓力,一般我們查詢資料的時候都會使用pagehelper進行分頁查詢,為了更加清晰的顯示我們展示的資料,使用bootstrap table展示資料,bootstrap table獲取資料有兩種途經,一種是客戶端模式,即獲取全部資料之後,在前端進行分頁展示。另外一種,也就是我們接下來要說的服務端模式:要獲取的資料資訊,比如獲取資料頁碼,每一頁資料的大小,都可以通過前端傳送以上的引數向後臺發請求,後臺得到這些引數資訊之後返回資料。
6 引入bootstrap table相關的js css檔案之後,開始在網上找了一些資料之後發現很多都是要在前端頁面新增如下繁瑣的配置,

       $('#mytable').bootstrapTable({
                 //請求方法
                method: 'get',
                 //是否顯示行間隔色
                striped: true,
                //是否使用快取,預設為true,所以一般情況下需要設定一下這個屬性(*)     
                cache: false,    
                //是否顯示分頁(*)  
                pagination: true,   
                 //是否啟用排序  
                sortable: false,    
                 //排序方式 
                sortOrder: "desc",    
                //初始化載入第一頁,預設第一頁
                //我設定了這一項,但是貌似沒起作用,而且我這預設是0,- -
                //pageNumber:1,   
                //每頁的記錄行數(*)   
                pageSize: 10,  
                //可供選擇的每頁的行數(*)    
                pageList: [10, 25, 50, 100],
                //這個介面需要處理bootstrap table傳遞的固定引數,並返回特定格式的json資料  
                url: "${contextPath}/mapper/getTableData",
                //預設值為 'limit',傳給服務端的引數為:limit, offset, search, sort, order Else
                //queryParamsType:'',   
                ////查詢引數,每次呼叫是會帶上這個引數,可自定義                         
                queryParams: queryParams : function(params) {
                    var subcompany = $('#subcompany option:selected').val();
                    var name = $('#name').val();
                    return {
                          pageNumber: params.offset+1,
                          pageSize: params.limit,
                          companyId:subcompany,
                          name:name
                        };
                },
                //分頁方式:client客戶端分頁,server服務端分頁(*)
                sidePagination: "server",
                //是否顯示搜尋
                search: false,  
                //Enable the strict search.    
                strictSearch: true,
                //Indicate which field is an identity field.
                idField : "id",
                columns: [],
                pagination:true
            });

每次新增一個頁面如果都要新增以上的配置資訊也顯得繁瑣,不過bootstrap-table.js裡面有個預設的配置,只需要修改裡面的幾個配置。

 contentType: 'application/json',//post請求頭 application/x-www-form-urlencoded; charset=UTF-8'
 dataType: 'json',
 sidePagination: 'server', // 改成server       

當我們點選表格分頁頁碼的時候,獲取改變每頁顯示的頁碼時候,前端會自動呼叫queryParams()方法,我們需要將這些資料傳遞給後臺,

       function queryParams(params) {
			var query={};
			query["limit"] = params.limit;//第幾條資料開始
			query["offset"] = params.offset;//資料大小
			return query;
		}

6 配合上一步前端的分頁,我們就需要使用pagehelp外掛了,同樣我們把這個分頁的方法放在通用server類上,

 public TableData<T> getTableData(PageBean bean) {
        int count = mapper.selectAll().size();
        if (count > 0) {
            PageHelper.startPage((bean.getOffset()/bean.getLimit()) + 1, bean.getLimit());
            List<T> list = this.findAll();
            return TableData.bulid(count, list);
        }

        return TableData.empty();
    }

上面的pagehelper.startpage需要做一點改變,前端傳過來的是顯示第幾條資料,但是startpage方法第一個引數是顯示第幾頁的資料,所以做一個轉換pageoffset/limit +1,然後在查詢資料,需要注意的是,一定要將startpage方法方法查詢資料語句的前一行,不能空行,或者換行。

附錄:

github原始碼
demo展示

相關文章