您的位置:首页 > 编程语言 > Java开发

bootstrap+pageHelper+spring boot 实现分页

2018-08-08 16:08 519 查看

后台通过mybatis插件pageHelper实现分页查询

先上效果图

maven地址

[code]                <dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper-spring-boot-starter</artifactId>
<version>1.2.3</version>
</dependency>

controller

[code]@RequestMapping("/index")
public String index(Model model,Integer pageNumber){
if (pageNumber == null){
pageNumber = 1;
}
PageHelper.startPage(pageNumber,3);
List<ScoreReport> list = this.scoreReportService.getPageList();
PageInfo<ScoreReport> pageInfo = new PageInfo<>(list);
model.addAttribute("pageInfo",pageInfo);
return "score";
}

 PageHelper.startPage()方法下需要就应该是查询语句

大概意思就是我要开始查询了,准备分页吧

前台页面网上参考地址找不到了

上js代码

<div style="float: right;">
<div style="float: right;">
当前${pageInfo.pageNum}页,共${pageInfo.pages }页,总${pageInfo.total }条记录
</div>
<div>
<ul class="pagination">
<!--
1.pageContext.request.contextPath表示当前项目路径,采用的是绝对路径表达方式。一般为http:localhost:8080/项目名 。
2.首页,末页的逻辑:pn=1访问第一次,pn=${pageInfo.pages}访问最后一页
-->
<li>
<a href="${pageContext.request.contextPath}/index?pageNumber=1">首页</a>
</li>
<!-- 如果还有前页就访问当前页码-1的页面, -->
<c:if test="${pageInfo.hasPreviousPage}">
<li>
<a href="${pageContext.request.contextPath}/index?pageNumber=${pageInfo.pageNum-1}" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
</c:if>
<li>
<!--遍历所有导航页码,如果遍历的页码页当前页码相等就高亮显示,如果相等就普通显示  -->
<c:forEach items="${pageInfo.navigatepageNums }" var="page_Nums">
<c:if test="${page_Nums==pageInfo.pageNum }">
<li class="active"><a href="#">${page_Nums}</a></li>
</c:if>
<c:if test="${page_Nums!=pageInfo.pageNum }">
<li ><a href="${pageContext.request.contextPath}/index?pageNumber=${page_Nums}">${page_Nums}</a></li>
</c:if>
</c:forEach>
</li>
<!-- 如果还有后页就访问当前页码+1的页面, -->
<c:if test="${pageInfo.hasNextPage}">
<li>
<a href="${pageContext.request.contextPath}/index?pageNumber=${pageInfo.pageNum+1}" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
</c:if>
<li><a href="${pageContext.request.contextPath}/index?pageNumber=${pageInfo.pages}">末页</a></li>
</ul>
</div>
</div>
阅读更多
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: