ページ表示機能の紹介(写真):
指定されたページ番号に従ってデータを取得します
1ページあたりの指定レコード数に応じて取得
機能解析
ページングページで使用されるデータには、4つの整数セットがあります。参照PageBeanクラス
4つの整数は
-
総ページ数
-
合計
-
1ページあたりのレコード数
-
現在のページ番号
コレクション
- データベースで照会された会社のレコードコレクション、表示に使用されたレコードを一覧表示します
自分でpageBeanを作成する必要はありません。pagehelper
このページングプラグインを直接使用します
pagehelperの使用
- (1)依存関係
<!--properties标签中的版本-->
<pagehelper.version>5.1.8</pagehelper.version>
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>${pagehelper.version}</version>
</dependency>
<!-- PageHelper配置 -->
<property name="plugins">
<array>
<bean class="com.github.pagehelper.PageInterceptor">
<property name="properties">
<!--使用下面的方式配置参数,一行配置一个 -->
<!-- pageNum<=0 时会查询第一页 -->
<!-- 指定数据库方言 -->
<value>
reasonable=true
helperDialect=mysql
</value>
</property>
</bean>
</array>
</property>
PageHelper構成の具体的な場所は次のとおりです。
背後にあるコード
TestCompanyService
@Test
public void test05(){
int currentPage = 1;
int pageSize = 3;
//PageInfo 包含四个整数 一个集合
PageInfo<Company> pi = companyService.findPage(currentPage,pageSize);
l.info("test05 pi = "+pi);
}
次の図に示すように、このメソッドcompanyService.findPage(currentPage,pageSize);
はpageInfo
クラスを返します。を押してCtrl+鼠标左键
このクラスに入り、そのソースコードを確認します。
pagehelperを構成すると、pageInfoクラスで返されるプロパティによって自動的に値が割り当てられます。このように、それを使用してgetメソッドを呼び出すだけで、クラスの値を取得できます。
ICompanyService
PageInfo<Company> findPage(int currentPage, int pageSize);
CompanyServiceImpl
@Override
public PageInfo<Company> findPage(int currentPage, int pageSize) {
//设置参数
PageHelper.startPage(currentPage,pageSize);
//查询由拦截器在 select * from ss_company 基础上,生成
//select count(*) from ss_company
//select * from ss_company limit (currentPage-1)*pageSize ,pageSize
List<Company> list = iCompanyDao.findAll();
//将集合封装
PageInfo<Company> pi = new PageInfo<>(list);
return pi;
}
ここにメモがあります@Deprecated
@Deprecated
メソッドに追加すると、メソッドは失敗します。
CompanyController
@RequestMapping(path="/toList",method = RequestMethod.GET)
public String toList( Integer curr, Integer pageSize, Model model){
//调service获取数据
if (curr == null) {
curr = 1;
}
if (pageSize == null) {
pageSize = 10;
}
PageInfo<Company> pi = iCompanyService.findPage(curr,pageSize);
l.info("toList pi="+pi);
model.addAttribute("pi",pi);
//将数据发到页面,使用标签
return "company/company-list";
}
フロントデスクコード
company-list.jsp
<div class="box-tools pull-right">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">首页</a>
</li>
<c:if test="${pi.hasPreviousPage}">
<li><a href="#">上一页</a></li>
</c:if>
<c:forEach begin="1" end="${pi.pages}" step="1" varStatus="vs" >
<c:if test="${vs.index == pi.pageNum}">
<li class="active" ><a href="#" >${vs.index}</a></li>
</c:if>
<c:if test="${vs.index != pi.pageNum}">
<li><a href="#">${vs.index}</a></li>
</c:if>
</c:forEach>
<c:if test="${pi.hasNextPage}">
<li><a href="#">下一页</a></li>
</c:if>
<li>
<a href="#" aria-label="Next">尾页</a>
</li>
</ul>
</div>
</div>
jspコード再利用の知識ポイントの紹介
-
(1)JSPコードは再利用可能
-
(2)jspコードを再利用する方法は?
jspページAを作成し、再利用コードを保存し、
現在のページBにAを導入します。
<jsp:include page="A.jsp" />
-
(3)BはパラメータをAに渡すことができます
<jsp:param name="jack" value="rose"/>
${param.jack}
具体的な例を次に示します。
demo02.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
</head>
<body>
<%-- 子标签param,将k-v值传给被include页面--%>
<jsp:include page="demo02_common.jsp">
<jsp:param name="userName" value="李柏霖"/>
<jsp:param name="url" value="http://123.com"/>
</jsp:include>
我是主要内容
</body>
</html>
ページ効果:
demo02_common.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
</head>
<body>
<h1>我是可以重用的jsp代码部分</h1>
${param.userName}
${param.url} //分页需要使用地址参数
</body>
</html>
##ページ効果:
価値移転図の再利用:
このsaasプロジェクトでjspコードを再利用します-ページングコード
-
(1)ページングツールバーは間違いなく再利用可能です
company-list.jspのページングツールバーコードを単一のpage.jspページにカプセル化します。
後のページでこのページネーションツールバーを使用する必要がある場合は、page.jspをページに導入できます。
<!--原本在company-list.jsp页面的分页工具条,被封装到page.jsp中,我这边引入page.jsp-->
<!-- /.box-footer-->
<div class="box-footer">
<jsp:include page="../common/page.jsp">
<jsp:param value="${path}/company/toList.do" name="pageUrl"/>
</jsp:include>
</div>
page.jsp
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<body>
<div class="pull-left">
<div class="form-group form-inline">
总共${pi.pages} 页,共${pi.total} 条数据。
<select class="form-control">
<option>2</option>
<option>10</option>
<option>15</option>
<option>20</option>
<option>50</option>
<option>80</option>
</select> 条
</div>
</div>
<div class="box-tools pull-right">
<ul class="pagination" style="margin: 0px;">
<li >
<a href="javascript:goPage(1)" aria-label="Previous">首页</a>
</li>
<c:if test="${pi.pageNum != 1 }">
<li><a href="javascript:goPage(${pi.prePage})">上一页</a></li>
</c:if>
<c:forEach begin="1" end="${pi.pages}" var="i">
<li class="paginate_button ${pi.pageNum==i ? 'active':''}"><a href="javascript:goPage(${i})">${i}</a></li>
</c:forEach>
<c:if test="${pi.pageNum != pi.pages }">
<li><a href="javascript:goPage(${pi.nextPage})">下一页</a></li>
</c:if>
<li>
<a href="javascript:goPage(${pi.pages})" aria-label="Next">尾页</a>
</li>
</ul>
</div>
<form id="pageForm" action="${param.pageUrl}" method="post">
<input type="hidden" name="curr" id="curr">
<input type="hidden" name="pageSize" id="pageSize">
</form>
<script>
function goPage(page) {
document.getElementById("curr").value = page //curr=2
document.getElementById("pageSize").value = ${
pi.pageSize} //pageSize=3
document.getElementById("pageForm").submit()
}
</script>
</body>
</html>
- (2)ページのel式を再変更します