补一个前后端框架搭建中的分页功能的详细工作:
性能管理的分页查询为例:
@GetMapping("/page")
public Result findPage(@RequestParam Integer pageNum,
@RequestParam Integer pageSize,
@RequestParam(defaultValue = "") String name){ //(defaultValue = "")表示不传参数时设置为空
IPage<Methods> page = new Page<>(pageNum,pageSize);
QueryWrapper<Methods> queryWrapper = new QueryWrapper<>();
if(!"".equals(name)){ //不为空时再进行查询拼接
queryWrapper.like("name",name);
}
queryWrapper.orderByDesc("id"); //插入的id实现倒序排列
return Result.success(methodsService.page(page,queryWrapper));
}
<div style="padding: 10px 0;">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:aria-current="pageNum"
:page-sizes="[2, 5, 10, 20]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>