總結一下最近學習項目中的一個模塊-- 分頁查詢。即如何將數據庫查到的結果顯示到頁面上? 後臺代碼又該如何操作?
同步查詢流程圖:
準備工作: 創建一個 Page 對象用於參數傳遞。
package com.atguigu.atcrowdfunding.util;
import java.util.List;
public class Page {
//當前頁
private Integer pageno;
//當前頁的數據
private Integer pagesize;
//總共多少頁 totalsize/pagesize
private Integer totalno;
private Integer totalsize;
private List datails;
// altr+shift + s 快速打開工具
public Page(Integer pageno,Integer pagesize)
{
if(pageno<=0)
{
this.pageno =1;
}else {
this.pageno = pageno;
}
if(pageno<=0)
{
this.pagesize =1;
}else {
this.pagesize = pagesize;
}
}
public Integer getPageno() {
return pageno;
}
public void setPageno(Integer pageno) {
this.pageno = pageno;
}
public Integer getPagesize() {
return pagesize;
}
public void setPagesize(Integer pagesize) {
this.pagesize = pagesize;
}
public Integer getTotalno() {
return totalno;
}
private void setTotalno(Integer totalno) {
this.totalno = totalno;
}
public Integer getTotalsize() {
return totalsize;
}
public void setTotalsize(Integer totalsize) {
this.totalsize = totalsize;
this.totalno = (totalsize%pagesize)==0?(totalsize/pagesize):(totalsize/pagesize+1);
}
public List getDatails() {
return datails;
}
public void setDatails(List datails) {
this.datails = datails;
}
//開始索引是啥?
public Integer startIndex()
{
return (pageno-1)*pagesize;
}
}
在 html頁面輸入攔截地址:
在表現層進行抵制攔截:
@RequestMapping("/index")
public String querySizes( Integer pageno , Integer pagesize, Map map)
{
//利用UserService 代理對象進行查詢
Page p = (Page) us.queryPage2(pageno,pagesize);
//將對象放入 request 域中
map.put("page", p);
//重定向
return "/user/inidex";
}
在 UserService 業務層接口實現代碼:
public Page queryPage2(@RequestParam(value="pageno",required=false,defaultValue="1")Integer pageno,
@RequestParam(value="pageno",required=false,defaultValue="10")Integer pagesize) {
Page p = new Page(pageno,pagesize);
Integer index = p.startIndex();
//查詢總人數
Integer count = userMapper.queryCount2();
p.setPagesize(count);
// 查詢到的信息
List<User>details = userMapper.queryListDetails(pageno,pagesize);
p.setDatails(details);
//返回查詢到數據對象
return p;
}
數據庫 UserMapper 代碼(利用到了 mybatis 框架):
<select id="queryCount2" resultType="int">
select count(*) from t_user
</select>
<select id="queryListDetails" resultMap="BaseResultMap">
select * from t_user
<where>
limit #{pageno},#{pagesize}
</where>
</select>
數據被查到了,並且也放入了 request 域中,那渲染頁面的時候咋讓數據顯示出來呢?
因爲在表現層把 page(p)對象放入了 request域中。
<ul class="pagination">
<c:if test="${page.pageno==1}">
<li class="disabled"><a href="#">上一頁</a></li>
</c:if>
<c:if test="${page.pageno!=1}">
<li><a href="#" onclick="pageChange(${page.pageno-1})">上一頁</a></li>
</c:if>
<!--
<li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li> -->
<!-- 如果是 100 頁咋辦呢? -->
<c:forEach begin="1" end="${page.tatalno}" var="num" >
<li
<c:if test="${page.pageno==num}">
class="active"
</c:if>
>
<a href="#" onclick="pageChange($num)">${num}</a></li>
</c:forEach>
<c:if test="${page.pageno==page.totalno}">
<li class="disabled"><a href="#">下一頁</a></li>
</c:if>
<c:if test="${page.pageno!=page.totalno}">
<li><a href="#" onclick="pageChange(${page.pageno+1})">下一頁</a></li>
</c:if>
</ul>
上一頁,下一頁按鈕所觸發的函數:
最終結果:
同步請求的效率太低了,用戶體驗不好,你查詢一個數據等半天,你受得了?
接下來 異步請求 閃亮登場。