前端代码

<div class="block"><span class="demonstration">页数较少时的效果</span><el-paginationlayout="prev, pager, next":total="50"></el-pagination>
</div>

参考Element-UI

total:0,
form: {title: '',pageNo: 1,pageSize: 4
}

后端代码示例

web层

@RequestMapping("/news")
public Result getNews(@RequestBody News news) {PageInfo<News> pageInfo = newsService.findNewsList(news);return new Result(200, "查询成功", pageInfo);
}

Service层

PageHelper.startPage(news.getPageNo(), news.getPageSize());List<News> newsList = newsDao.findNewsList(news);
PageInfo<News> pageInfo = new PageInfo<>(newsList);
return pageInfo;

依赖

<dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper-spring-boot-starter</artifactId><version>1.4.5</version>
</dependency>