1.建立資料庫表,以oracle中建立users資料表為例并添加資料
-- 使用者資訊表
create table users(
u_id integer primary key, -- 使用者id
u_name varchar2(30) not null unique, --使用者姓名
u_password varchar2(16) not null, --使用者密碼
u_phone varchar2(11) unique, --使用者手機号
u_email varchar2(26) unique, --使用者郵箱
u_jurisdiction varchar2(40) not null --使用者權限
);
--使用者表自動增長序列
create sequence sequence_uid start with 1 increment by 1;
-- 使用者表id觸發器
create or replace trigger tr_users
before insert on users
for each row
begin
select sequence_uid.nextval into :new.u_id from dual;
end;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('admin','admin','17684542','[email protected]','user:amdin');
commit;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('張三','user','123465888','[email protected]','user:update');
commit;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('李四','user','163746734','[email protected]','user:update');
commit;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('qq','user','454545454','[email protected]','user:update');
commit;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('ww','user','13435454','[email protected]','user:update');
commit;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('ee','user','767657567','[email protected]','user:update');
commit;
insert into users(u_name,u_password,u_phone,u_email,u_jurisdiction)
values('tt','user','8989898','[email protected]','user:update');
commit;
2.修改pom.xml檔案,引入pagehelper依賴
<!-- pagehelper分頁插件 -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>5.1.4</version>
</dependency>
<!-- 分頁插件 -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper-spring-boot-starter</artifactId>
<version>1.2.5</version>
</dependency>
3.打開application.properties,配置分頁
#分頁插件
pagehelper.helper-dialect=oracle #指定資料庫,對應什麼資料庫就寫什麼,沒寫會自動檢測
pagehelper.params=count=countSql
pagehelper.reasonable=true
pagehelper.support-methods-arguments=true
4.直接用mybatis逆向工程插件建立相應的方法,具體可看之前的部落格SpringBoot使用mybatis插件自動建立逆向工程
5.添加一個RequestMapping
@RequestMapping("searchuser")
public String searchUser(Model model,@RequestParam(value="pageNum",defaultValue="1")Integer pageNum) {
//查詢之前調用startPage,就是每頁顯示多少條資料
PageHelper.startPage(pageNum, 3);
//拿到所有使用者資料
List<Users> list = userServiceImp.queryAllUsers();
//将查詢到的資料放入pagehepler中
PageInfo<Users> pageInfo = new PageInfo<Users>(list);
// 将查詢到的資料存到傳回
model.addAttribute("pageInfo", pageInfo);
return "userfrom";
}
6.在src/main/resources的templates下建立一個userfrom.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>所有使用者</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" target="_blank" rel="external nofollow" >
<script src="https://cdn.staticfile.org/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div align="center">
<table id="mytable"
class="table table-striped table-hover table-condensed table-bordered">
<thead>
<tr>
<th>id</th>
<th>姓名</th>
<th>手機号</th>
<th>郵箱</th>
<th>權限</th>
</tr>
</thead>
<tbody>
<tr th:each="users:${pageInfo.list}">
<td th:text="${users.u_id}"></td>
<td th:text="${users.u_name}"></td>
<td th:text="${users._phone}"></td>
<td th:text="${users.u_email}"></td>
<td th:text="${users.u_jurisdiction}"></td>
</tr>
</tbody>
</table>
<p>
目前 <span th:text="${pageInfo.pageNum}"></span> 頁,總 <span
th:text="${pageInfo.pages}"></span> 頁,共 <span
th:text="${pageInfo.total}"></span> 條記錄
</p>
<ul class="pagination">
<li><a th:href="@{/user/searchuser}" target="_blank" rel="external nofollow" >第一頁</a> </li>
<li><a th:href="@{/user/searchuser(pageNum=${pageInfo.hasPreviousPage}?${pageInfo.prePage}:1)}" target="_blank" rel="external nofollow" >上一頁</a></li>
<li><a th:href="@{/user/searchuser(pageNum=${pageInfo.hasNextPage}?${pageInfo.nextPage}:${pageInfo.pages})}" target="_blank" rel="external nofollow" >下一頁</a></li>
<li><a th:href="@{/user/searchuser(pageNum=${pageInfo.pages})}" target="_blank" rel="external nofollow" >最後一頁</a></li>
</ul>
</div>
</body>
</html>
7.啟動項目,浏覽器輸入http://localhost:8089/user/searchuser(成功)
