后端:
第一步 新建pageVo 存放当前页和每页多少数据
@Data
public class PageVo {
private Integer currentPage;
private Integer pageSize;
}
第二步 添加一个mybatisplus的分页配置类
@Configuration
public class MybatisPlusConfig {
@Bean
public MybatisPlusInterceptor mybatisPlusInterceptor() {
MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.H2));
return interceptor;
}
}
第三步 在controller中写一个post请求
@PostMapping ("/ScoreByPage")
public ResultVo allScorePage(@RequestBody PageVo pageVo){
return subjectScoreService.studentScorePage(pageVo);
}
第四步 在service中写具体的业务方法
@Override
public ResultVo studentScorePage(PageVo pageVo) {
//1.将pageVo类赋值给page
Page page = new Page<>(pageVo.getCurrentPage(), pageVo.getPageSize());
//2.按学号排序
LambdaQueryWrapper queryWrapper = new LambdaQueryWrapper<>();
queryWrapper.orderByAsc(SubjectScoreDO::getUsernumber);
//3.将条件给mybatisPlus中的分页方法
Page scorePage = subjectScoreMapper.selectPage(page,queryWrapper);
//4.将查询出的结果赋值给list数组
List scoreListPage = scorePage.getRecords();
if(scoreListPage == null){
return CommonResult.fail();
}else{
return CommonResult.success(scoreListPage);
}
}
前端:
第一步 在element官网找到分页代码 复制 然后就弄一下 发送一下页码信息,接受一下后端信息
效果展示:



