分页功能

1,使用后台实现

//用于分页的类,保存分页的信息!后台实现
package xgl.dto;

import lombok.Data;

import java.util.ArrayList;
import java.util.List;
//传递page分页数据

@Data
public class PaginationDTO {
    //该页面的数据(问题)
    private List<QuestionDTO> questions;
    private boolean showPrevious;//是否上一页
    private boolean showFirstPage;//是否第一页
    private boolean showNext;//下一页
    private boolean showEndPage;//最后一页
    private Integer page;//当前页码
    //必须new出来!后面直接使用
    private List<Integer> pages=new ArrayList<>();//附近页码,妙用!
    private Integer totalCount;//总条数
    private Integer totalPage;//总页数

    //设置page
    public void setPagination(Integer totalCount, Integer page, Integer size) {
        //计算页数
        if (totalCount%size==0){
            totalPage=totalCount/size;
        }else {
            totalPage=totalCount/size+1;
        }
        //防止错误的page
        if (page<1){
            page=1;
        }
        if (page>totalPage){
            page=totalPage;
        }
        this.page=page;
        //显示附近页码
        pages.add(page);
        for (int i=1;i<=3;i++){
            if (page-i>0){
                //page前面的页面
                pages.add(0,page-i);
            }
            if (page+i<=totalPage){
                //page后面的页面
                pages.add(page+i);
            }
        }
        //是否展示上一页
        if(page==1){
            showPrevious=false;
        }else {
            showPrevious=true;
        }
        //是否展示下一页
        if (page==totalPage){
            showNext=false;
        }else {
            showNext=true;
        }
        //是否展示第一页
        if (pages.contains(1)){
            showFirstPage=false;
        }else {
            showFirstPage=true;
        }
        //是否展示最后一页
        if (pages.contains(totalPage)){
            showEndPage=false;
        }else {
            showEndPage=true;
        }
    }
}

前端界面:
在这里插入图片描述

//前端界面
<!--分页-->
            <nav aria-label="Page navigation">
                <ul class="pagination">
                    <li th:if="${pagination.showFirstPage}">
                        <a href="/?page=1" aria-label="Previous">
                            <span aria-hidden="true">&lt;&lt;</span>
                        </a>
                    </li>
                    <li th:if="${pagination.showPrevious}">
                        <a th:href="@{/(page=${pagination.page}-1)}" aria-label="Previous">
                            <span aria-hidden="true">&lt;</span>
                        </a>
                    </li>
                    <!--遍历pages-->
                    <li th:each="page : ${pagination.pages}" th:class="${pagination.page==page} ? 'active' : '' ">
                        <a th:href="@{/(page=${page})}" th:text="${page}"></a>
                    </li >
                    <li th:if="${pagination.showNext}">
                        <a th:href="@{/(page=${pagination.page}+1)}" aria-label="Next">
                            <span aria-hidden="true">&gt;</span>
                        </a>
                    </li>
                    <li th:if="${pagination.showEndPage}">
                        <a th:href="@{/(page=${pagination.totalPage})}" aria-label="Next">
                            <span aria-hidden="true">&gt;&gt;</span>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>

Controller层代码:

package xgl.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import xgl.dto.PaginationDTO;
import xgl.dto.QuestionDTO;
import xgl.mapper.UserMapper;
import xgl.model.User;
import xgl.service.QuestionService;

import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;
import java.util.List;

@Controller
public class IndexController {

    @Autowired
    private QuestionService questionService;

    @RequestMapping("/")
    public String index(HttpServletRequest request,
                        Model model,
                        @RequestParam(name = "page",defaultValue = "1")Integer page,
                        @RequestParam(name = "size",defaultValue = "4")Integer size
    ) {
        //根据page和size查询数据
        PaginationDTO pagination=questionService.list(page,size);
        //把该页的数据放到前端
        model.addAttribute("pagination",pagination);
        return "index";
    }
}

Service

//查询所有的问题
    public PaginationDTO list(Integer page, Integer size) {
        //返回的是page信息
        PaginationDTO paginationDTO = new PaginationDTO();
        Integer totalCount = (int)questionMapper.countByExample(new QuestionExample());
        Integer totalPage;//总页数
        //计算页数
        if (totalCount % size == 0) {
            totalPage = totalCount / size;
        } else {
            totalPage = totalCount / size + 1;
        }
        //防止错误的page
        if (page < 1) {
            page = 1;
        }
        if (page > totalPage) {
            page = totalPage;
        }
        //设置paginationDTO
        paginationDTO.setPagination(totalPage, page);
        //offset是该页面开始的条数
        Integer offset = size * (page - 1);
        //根据offset和size查询内容
        //mybatis的分页查询!
        List<Question> questions = questionMapper.selectByExampleWithRowbounds(new QuestionExample(),new RowBounds(offset,size));
        List<QuestionDTO> questionDTOList = new ArrayList<>();
        //questions组装user
        for (Question question : questions) {
            //查询
            User user = userMapper.selectByPrimaryKey(question.getCreator());
            QuestionDTO questionDTO = new QuestionDTO();
            //赋值!
            BeanUtils.copyProperties(question, questionDTO);
            //设置user
            questionDTO.setUser(user);
            questionDTOList.add(questionDTO);
        }

        //把问题放入page
        paginationDTO.setQuestions(questionDTOList);
        return paginationDTO;
    }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值