SpringBoot项目(瑞吉外卖)分页查询功能的实现

分页查询

代码逻辑:

  1. 页面发送ajax请求,将分页查询参数(page,pageSize)提交到服务端

  2. 服务端Controller接收到接收到页面提交的数据并调用Service查询数据

  3. 调用Mapper查询数据库

  4. Controller操作数据库将查询到的数据响应给页面

  5. 页面接收到数据并通过ElementUI的Table组件展示到页面

由于前端已经写好,我们展示以下前端的代码,本章主要介绍后端的逻辑

 (大家可以在这里领取完整的资料:https://kdocs.cn/l/cja9JxdvbyUa  ​​​​​

UI组件

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第1张图片SpringBoot项目(瑞吉外卖)分页查询功能的实现_第2张图片

 

发送ajax的js代码

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第3张图片

 

步骤:

  1. 构造分页构造器

  2. 构造条件构造器

  3. 设置想要构造的条件

举例:只涉及一个表的展示和涉及两个表的展示

以下是涉及category表的分页展示和数据库字段

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第4张图片

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第5张图片 

 

代码逻辑:

1.我们在浏览器点击分类管理,打开控制台,则会找到分类查询的请求(由于我这里是提前完善好了功能,所以状态码是200,一般没有完善的话,左边的请求就会爆红并且右边的状态码是400)

2.我们找到请求地址是:http://localhost:8080/category/page?page=1&pageSize=10

为此需要在服务端完善这个请求,我们之前已经写好了CategoryController

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第6张图片

 

在这个类下面直接新建一个方法,请求方式是GET,请求的路径“/page",然后请求参数 int page 和 int pageSize

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第7张图片

 

3,代码逻辑

构造分页构造器

Page page = new Page<>();

构造条件构造器

LambdaQueryWrapper queryWrapper = new LambdaQueryWrapper<>();

设置分页条件

//根据sort进行排序
queryWrapper.orderByAsc(Category::getSort);

进行分页查询

categoryService.page(pageInfo,queryWrapper);

最后返回就可以

return R.success(pageInfo);

4.完整代码

/**
 * 分页查询
 * @param page
 * @param pageSize
 * @return
 */
@GetMapping("/page")
public R page(int page,int pageSize){
    //分页构造器
    Page pageInfo = new Page<>(page,pageSize);
    //条件构造器
    LambdaQueryWrapper queryWrapper = new LambdaQueryWrapper<>();
    //根据sort进行排序
    queryWrapper.orderByAsc(Category::getSort);
    //进行分页查询
    categoryService.page(pageInfo,queryWrapper);
    return R.success(pageInfo);
}

最后运行看看运行结果

SpringBoot项目(瑞吉外卖)分页查询功能的实现_第8张图片

 

你可能感兴趣的:(java,前端,javascript)