参考本章设定的原型
![](https://img.kancloud.cn/17/0c/170cf582303bb686f0061f5e2e97c953_1007x646.png)
在本节中,我们主要实现两项功能:
* [ ] 实现获取分页数据
* [ ] 实现多条件查询
数据分页与多条件查询每个成型项目所必段具备的功能。想获取分页的数据,则最少需要明确两个因素,即我们需要第几页的数据以及每页数据设定为多少条(每页大小);想按多查询来查询数据,则需要明确每个查询条件的值。则在本例中,前台向后台发起请求时,需要明确以下5个条件:第几页、每页大小、姓名、学号、班级
在查询操作中,我们使用get方法来进行请求,并把相关的查询条件放到查询的参数中。依此我们可定制如下查询规范:
```
GET /Student
```
##### 参数 Parameters
| type | name | Description | Schema |
| --- | --- | --- | --- |
| **Query** | **page** <br> **required①** | 第几页 | int |
| **Query** | **size** <br> **required①** | 每页大小 | int |
| **Query** | **name**➋ <br> **optional➊** | 学生姓名 | string |
| **Query** | **sno** ➌<br> **optional➊** | 学号 | string |
| **Query** | **klassId** ➍<br> **optional➊** | 班级ID | Long |
* ① 该查询条件为**必填**项,必须传入,不传入则会发生异常
* ➊ 该查询条件为**可选**项,可以传也可以不传
* ➋ %like%查询
* ➌ like%查询
* ➍ 精确查询
如果你学习过数据的相关课程,相信对➋➌两个查询条件并不陌生。以字符串`mengyunzhi`为例,在进行`%like%`查询时:关键字`meng`,`yun`,`zh`等只要被包含在`mengyunzhi`字符串中的均可以查询成功;而在进行`like%`查询时,只能`me`、`meng`等字符串可以查询成功,而`yun`,`zhi`等字符串则查询失败。
##### 响应(返回值)Responses
在以往的响应信息中,后台只需要返回给我们数组就可以了。但本节的原型在分页模块中要求学生的总页数:
![](https://img.kancloud.cn/59/f5/59f589f82f16d188f2cac1f708066b2e_343x81.png)
此时后台如果仅仅返回当前页的学生数组便满足不了我们的要求。处理这种情况我们通用的做法就是在学生数组外面套个壳。
![](https://img.kancloud.cn/72/52/7252bf7f5b74bd2c4832fd0fb7e76e4d_170x151.png)
然后将带有学生数组和总页数的新对象组合在一起进行传输。这样便解决了在一次传输中,即传输学生数组又传输总页的问题。
| HTTP Code | Description | Schema |
| --- | --- | --- |
| **200** | OK | `带有数组<Student>①及总页的壳`|
* ① 该壳中有一个可以装载任意对象的数组
# 预期效果
- 序言
- 第一章:Hello World
- 第一节:Angular准备工作
- 1 Node.js
- 2 npm
- 3 WebStorm
- 第二节:Hello Angular
- 第三节:Spring Boot准备工作
- 1 JDK
- 2 MAVEN
- 3 IDEA
- 第四节:Hello Spring Boot
- 1 Spring Initializr
- 2 Hello Spring Boot!
- 3 maven国内源配置
- 4 package与import
- 第五节:Hello Spring Boot + Angular
- 1 依赖注入【前】
- 2 HttpClient获取数据【前】
- 3 数据绑定【前】
- 4 回调函数【选学】
- 第二章 教师管理
- 第一节 数据库初始化
- 第二节 CRUD之R查数据
- 1 原型初始化【前】
- 2 连接数据库【后】
- 3 使用JDBC读取数据【后】
- 4 前后台对接
- 5 ng-if【前】
- 6 日期管道【前】
- 第三节 CRUD之C增数据
- 1 新建组件并映射路由【前】
- 2 模板驱动表单【前】
- 3 httpClient post请求【前】
- 4 保存数据【后】
- 5 组件间调用【前】
- 第四节 CRUD之U改数据
- 1 路由参数【前】
- 2 请求映射【后】
- 3 前后台对接【前】
- 4 更新数据【前】
- 5 更新某个教师【后】
- 6 路由器链接【前】
- 7 观察者模式【前】
- 第五节 CRUD之D删数据
- 1 绑定到用户输入事件【前】
- 2 删除某个教师【后】
- 第六节 代码重构
- 1 文件夹化【前】
- 2 优化交互体验【前】
- 3 相对与绝对地址【前】
- 第三章 班级管理
- 第一节 JPA初始化数据表
- 第二节 班级列表
- 1 新建模块【前】
- 2 初识单元测试【前】
- 3 初始化原型【前】
- 4 面向对象【前】
- 5 测试HTTP请求【前】
- 6 测试INPUT【前】
- 7 测试BUTTON【前】
- 8 @RequestParam【后】
- 9 Repository【后】
- 10 前后台对接【前】
- 第三节 新增班级
- 1 初始化【前】
- 2 响应式表单【前】
- 3 测试POST请求【前】
- 4 JPA插入数据【后】
- 5 单元测试【后】
- 6 惰性加载【前】
- 7 对接【前】
- 第四节 编辑班级
- 1 FormGroup【前】
- 2 x、[x]、{{x}}与(x)【前】
- 3 模拟路由服务【前】
- 4 测试间谍spy【前】
- 5 使用JPA更新数据【后】
- 6 分层开发【后】
- 7 前后台对接
- 8 深入imports【前】
- 9 深入exports【前】
- 第五节 选择教师组件
- 1 初始化【前】
- 2 动态数据绑定【前】
- 3 初识泛型
- 4 @Output()【前】
- 5 @Input()【前】
- 6 再识单元测试【前】
- 7 其它问题
- 第六节 删除班级
- 1 TDD【前】
- 2 TDD【后】
- 3 前后台对接
- 第四章 学生管理
- 第一节 引入Bootstrap【前】
- 第二节 NAV导航组件【前】
- 1 初始化
- 2 Bootstrap格式化
- 3 RouterLinkActive
- 第三节 footer组件【前】
- 第四节 欢迎界面【前】
- 第五节 新增学生
- 1 初始化【前】
- 2 选择班级组件【前】
- 3 复用选择组件【前】
- 4 完善功能【前】
- 5 MVC【前】
- 6 非NULL校验【后】
- 7 唯一性校验【后】
- 8 @PrePersist【后】
- 9 CM层开发【后】
- 10 集成测试
- 第六节 学生列表
- 1 分页【后】
- 2 HashMap与LinkedHashMap
- 3 初识综合查询【后】
- 4 综合查询进阶【后】
- 5 小试综合查询【后】
- 6 初始化【前】
- 7 M层【前】
- 8 单元测试与分页【前】
- 9 单选与多选【前】
- 10 集成测试
- 第七节 编辑学生
- 1 初始化【前】
- 2 嵌套组件测试【前】
- 3 功能开发【前】
- 4 JsonPath【后】
- 5 spyOn【后】
- 6 集成测试
- 7 @Input 异步传值【前】
- 8 值传递与引入传递
- 9 @PreUpdate【后】
- 10 表单验证【前】
- 第八节 删除学生
- 1 CSS选择器【前】
- 2 confirm【前】
- 3 功能开发与测试【后】
- 4 集成测试
- 5 定制提示框【前】
- 6 引入图标库【前】
- 第九节 集成测试
- 第五章 登录与注销
- 第一节:普通登录
- 1 原型【前】
- 2 功能设计【前】
- 3 功能设计【后】
- 4 应用登录组件【前】
- 5 注销【前】
- 6 保留登录状态【前】
- 第二节:你是谁
- 1 过滤器【后】
- 2 令牌机制【后】
- 3 装饰器模式【后】
- 4 拦截器【前】
- 5 RxJS操作符【前】
- 6 用户登录与注销【后】
- 7 个人中心【前】
- 8 拦截器【后】
- 9 集成测试
- 10 单例模式
- 第六章 课程管理
- 第一节 新增课程
- 1 初始化【前】
- 2 嵌套组件测试【前】
- 3 async管道【前】
- 4 优雅的测试【前】
- 5 功能开发【前】
- 6 实体监听器【后】
- 7 @ManyToMany【后】
- 8 集成测试【前】
- 9 异步验证器【前】
- 10 详解CORS【前】
- 第二节 课程列表
- 第三节 果断
- 1 初始化【前】
- 2 分页组件【前】
- 2 分页组件【前】
- 3 综合查询【前】
- 4 综合查询【后】
- 4 综合查询【后】
- 第节 班级列表
- 第节 教师列表
- 第节 编辑课程
- TODO返回机制【前】
- 4 弹出框组件【前】
- 5 多路由出口【前】
- 第节 删除课程
- 第七章 权限管理
- 第一节 AOP
- 总结
- 开发规范
- 备用