JAVA零基础入门4-实现分页查询功能

实现了上传图片并显示的功能后，我们回顾一下，觉得查询全部菜品的功能有些不太完美，本章节实现分页查询功能，以更好的贴合实际需求

2023/10/31

1.查询全部功能

我们之前使用了caiservice的selectall方法来查询全部菜品，今天我们浅浅继续总结一下，为了与下面的分页查询做区分。

首先，前端部分，我们设置“全部菜品”按钮，并跳转到/all 路径

<button id="pageinfo" onclick="page()">全部菜品</button>
<script>
    function page(){
        window.location.href = '/all';
    }
</script>

其次，后端部分，我们直接调用方法，然后在model中加属性即可，非常简单
 

    @GetMapping ("/all")
    public String page(Model model){
        List<Cai> caiList = caiService.selectAll();
        model.addAttribute("caiList",caiList);
        model.addAttribute("imageURL","/image?id=");
        return "index";
    }

2.分页查询功能

在实现这个功能时，我搜集了很多资料，网上大抵有两种方法，一个是使用page类，但是配置麻烦，我也没有成功导入，第二个是使用mybatis插件方法，本着先学代码再方便的原则，我觉得暂时不应该使用插件的方法，我苦思冥想，终于利用我们之前学过的逻辑，浅浅的实现了我们的分页需求，具体做法如下：
首先，我们利用sql语句实现有限制的查询，这是书上都有的语句，写法如下：
 

    <select id="selectByPage" resultType="com.example.ding.entity.Cai">
        SELECT * FROM cai LIMIT #{size} OFFSET #{pageset}
    </select>

其中size是每页的个数，pageset为偏移量 也就是从哪个索引开始这一页，接下来我们只需要传递每一页的参数即可。

在传递参数之前记得写好selectByPage的接口方法，不需要写入mapper，代码如下：
 

List<Cai> selectByPage(int pageset, int size);

#实现类
    public List<Cai> selectByPage ( int pageset, int size){
        return caiMapper.selectByPage(pageset,size);
    }

在前端部分，我们选择form表单的形式来传递参数，方便我们获取model属性的值，前端页面如下：

<form method="get" th:action="@{/pageInfo}" id="caozuo" th:with="defaultPageNum=${pageNum != null ? pageNum : 10}">
    <label for="pageSelect">跳转到第</label>
    <select id="pageSelect" name="page">
        <option th:each="pageNum : ${#numbers.sequence(1,defaultPageNum)}"
                th:value="${pageNum}" th:text="${pageNum}">

        </option>
    </select>
    <span>页</span>
    <button type="submit">GO</button>
    <span th:text="'当前为第'+${pagelocal}+'页'"></span>
</form>

在其中我们用到了一些新的东西，其中th：with帮助我们定义了一个局部变量，因为在初始状态下，我们没有选择页数时，后端没有返回我们的总页数，所以设置默认的pagenum为10，否则会报错，下面，我们选择使用一个select下拉框的形式去跳转对应的页数，用文字来输入当前页。这个表单主要是将下拉框中的page参数传递出去，并在后端接收一个pagenum也就是总页数

后端部分，首先我们要处理page参数，设置我们想要的size，计算selectall方法获得的元素个数，并除以size得到我们想要的页数，这里因为int是向下取整，所以当没有整除时，我们要+1处理，使用selectbypage方法，查询对应的cai品信息，并加入到model中

    @GetMapping ("/pageInfo")
    public String page(@RequestParam(name = "page", defaultValue = "0") int page, Model model){
        int size = 2;  // 每页10条数据
        System.out.println(page);
        int pageset = 2*(page-1);
        int totalpage = caiService.selectAll().size();
        int pageNum = totalpage/size;
        if (totalpage%size!=0){
            pageNum++;
        }
        List<Cai> caiList = caiService.selectByPage(pageset, size);
        model.addAttribute("pageNum",pageNum);
        model.addAttribute("caiList", caiList);
        model.addAttribute("imageURL","/image?id=");
        model.addAttribute("pagelocal",page);
        System.out.println(caiList);
        return "index";
    }

具体实现图如下：

数据库部分共有6条菜品，当我选择第二页时，只显示索引为3和4的菜品