开发者学堂课程【微服务+全栈在线教育实战项目演练（SpringCloud Alibaba+SpringBoot）：讲师分页查询接口】学习笔记，与课程紧密连接，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/667/detail/11468
讲师分页查询接口
内容介绍：
一、复习回顾
二、讲师列表页
三、对比之前代码区别
一、复习回顾
本节讲解名师部分：
包括列表、详情部分。在之前内容中实现了名师页面静态效果，并整合了代码。
其中讲解到一个知识点：
在实现的页面上无论是点击课程或者名师，路径都是固定的，叫做固定路由。
现在点击某一个讲师，因为每一个讲师的id都不同，所以设置的路径也不同，例如第一个讲师 id 为1，第二个讲师id可能为2，第三个可能为3，这就叫做动态路由。
所以有两种路由，一个是固定，一个是动态。固定路由在 pages 里建立页面，如图有讲师 teacher，列表 index，有课程 course，列表 index
动态路由怎么创建页面呢？
将页面用下划线开头，后面加上参数名称，这就叫动态路由，例如_id.vue。根据 id得到课程的详情，就用到了动态路由。
总结：
固定路由用 index，动态路由用下划线开头。
以上为之前内容中名师页面静态效果的整合
二、讲师列表页
接下来讲解讲师列表页：
先做一个简单分析，依然按照前后端开发的流程，先写接口，然后测试，没有问题在前端调接口在页面中显示，这就是前后端的过程。
快速分析如何做到名师列表功能：
打开页面，点击名师进入到页面后，通过数据库来查数据，如图可以看到数据有一个特点：需要分页，所以查询就是分页查询
在查询中会有两个细节：
在现在页面中有八个讲师，即在显示过程中需要考虑页面的样式美观。
页面中的分页功能：
在之前后台系统中用的是 Element-ui 组件，但在此处页面中做比较底层的分页。
接下来编写代码，首先写第一个：
分页查询名师的接口
打开后端，因为是讲师部分，我们将代码写在 edu 中，又因为是前台管理系统，所以写在 front 中，新建一个 Controller 名为 TeacherFrontController。
在代码 public class TeacheFrontController 上方添加代码：
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.RestController;
@RestController
@RequestMapping(“/eduservice/teacherfront”)
@CrossOrigin
添加完上面两个注释后，在主函数中输入代码，
即：
public class TeacheFrontController{
@Autowired //此处会导包：
import org.springframework.web.bind.annotation.Autowired;
private EduTeacherService teacherService;
}
接下来继续在主函数代码中写入分页查询讲师的方法
//1.分页查询讲师的方法
@PostMapping(“getTeacherFrontList/{page}/{limit}”)//分页中应该有当前页和每次记录数，当前页为page，每页记录数为limit
//传完参数后再来写一个方法
public R getTeacherFrontList(@PathVariable long page,@PathVariable long limit){
return R.ok();//在方法中先 return 一个值防止报错
}
该方法写完后再来做具体分页，先new一个对象，然后起名，再=new对象，传入两个值：当前页和每页记录数，
代码为：
public R getTeacherFrontList(@PathVariable long page,@PathVariable long limit){
Page<EduTeacher> pageTeacher = new Page<>(page,limit);//此处需要引入page的mybatisplus对象和EduTeacher对象
//引入后来调用teacherService方法，输入代码：
teacherService.getTeacherFrontList(pageTeacher);
return R.ok();
}
三、对比之前代码区别
与之前讲师分页中的代码区别：
之前讲师分页中的代码：
return R.ok().data(“total”,total).data(“rows”,records);
传的是两个值：总记录数 total 和每页数据的 list 集合 records
用到的是 Element-ui 方式，而现在选用最原始的方式，所以返回的值就不能为两个值，而是要把分页中的所有值都返回
返回所有值有很多方法，下面讲解采用最通用的方式：
将 teacherService一行代码换为 Map 结构，，然后将 map 返回，在页面中通过map进行取值，修改为 Map<String,Object> map =teacherService.getTeacherFrontList(pageTeacher)
return R.ok().data(map);
接下来写
Service，在 EduTeacherService 中创建方法 getTeacherFrontList，
此处为 interface，再找到它的实现类，在实现类中实现该方法，实现类的代码如下：public class EduTeacherServiceImpl extends ServiceImpl <EduTeacherMapper,EduTeacher> implements EduTeacherService{
//1 分页查询讲师的方法
@Overridepublic Map<String,Object>getTeacherFrontList(Page<EduTeacher>pageParam) {
return null;
}
}
在该代码中继续输入：
QueryWrapper<EduTeacher>wrapper=new QueryWrapper<>();
wrapper.orderByDesc(...columns:”id”);//根据讲师的排序来添加条件
//把分页数据封装到pageTeacher对象
baseMapper.selectPage(pageTeacher,wrapper);
因为现在不是要返回 pageTeacher 对象，而是要返回 map 集合。所以要取出分页数据放到map集合中，继续输入代码：
//把分页数据获取出来，放到map集合
Map<String,Object> map = new HashMap<>();
再在该代码上方输入代码获取值：
List<EduTeacher> records = pageParam. getRecords();//每页数据的list集合
long current = pageParam. getCurrent () ;//当前页
long pages = pageParam. getPages() ;//总页数
long size = pageParam. getSize() ;//每页记录数
long total = pageParam. getTotal() ;//总记录数
boolean hasNext = pageParam. hasNext () ;//表示当前是否有下一页
boolean hasPrevious = pageParam. hasPrevious() ;//当前是否有上一页
之后继续放到map集合中，在代码map<String,Object>下输入
map. put(“items" , records) ;
map. put ( ”current" ,current) ;
map. put (”pages" , pages) ;
map. put("size", size) ;
map. put (" total” ,total) ;
map. put ("hasNext”, hasNext) ;
map. put (" hasPrevious" , hasPrevious) ;
之后做最后一步，需要将map进行返回
return map;
以上就做到了接口部分。这么做的目的是因为我们现在要手动写分页，所以该分页中需要所有数据，需要将所有数据进行返回。
做法是将分页数据取出放到map集合中然后进行 return 在前端数据中进行取。在实际开发中，选取相对简单的方式，就推荐之前内容中的 Element-ui 方式。
最后来启动测试一下，启动 EduApplication,启动之后打开端口号，8001来查看分页查询讲师的功能。
