我的项目效果图:


我的项目结构图：


为了不便大家练习，我的项目没有过多的代码，只有与分页相干的代码，而且分页性能应用的是PageHelper插件，所以实现分页性能超级简略。相干操作步骤及思路：
1、pom.xml文件引入PageHelper的jar包坐标
2、spring配置文件注入分页插件信息
3、dao层间接查问的是所有的数据
4、service层先设置分页查问的条件，比方当前页多少，每页显示多少条，而后再查问全副，返回的是一个Page对象
5、contraller层，获取页面传过来的参数（当前页，每页显示多少条数据），而后调用service层的办法，返回一个page对象，依据这个page对象再封装一个PageInfo对象，最初把PageInfo转成json格局返回页面即可。

我的项目环境：

前端：vue

后端：ssm（spring+springmvc+mybatis）

数据库：mysql

如果你在运行这个代码的过程中有遇到问题，请加小编vi信xxf960513，我拉你进对应学习群！！帮忙你疾速把握这个性能代码！

后端代码

1、pom.xml文件引入PageHelper的jar包坐标

<!--分页插件坐标-->    <dependency>      <groupId>com.github.pagehelper</groupId>      <artifactId>pagehelper</artifactId>      <version>5.1.2</version>   </dependency>

2、spring配置文件注入分页插件信息

 <!--整合mybatis到spring中-->    <bean class="org.mybatis.spring.SqlSessionFactoryBean">        <property name="dataSource" ref="dataSource"/>        <property name="typeAliasesPackage" value="com.javaxxf.pojo"/>        <!--分页插件-->        <property name="plugins">            <array>                <bean class="com.github.pagehelper.PageInterceptor">                    <property name="properties">                        <props>                            <prop key="helperDialect">mysql</prop>                            <prop key="reasonable">true</prop>                        </props>                    </property>                </bean>            </array>        </property>    </bean>

3、dao层间接查问的是所有的数据

ZiLiaoDao.java

@Componentpublic interface ZiLiaoDao {    @Select("SELECT * FROM ziliao")    public abstract List<ZiLiao> findAll();}

4、service层先设置分页查问的条件，比方当前页多少，每页显示多少条，而后再查问全副，返回的是一个Page对象

ZiLiaoServiceImpl.java

@Servicepublic class ZiLiaoServiceImpl  implements ZiLiaoService {    @Autowired    private ZiLiaoDao ziLiaoDao;    /**     *     * @author xuxiaofei     * @date 2021/8/13 上午10:54     * @param currentPage  当前页     * @param pageSize   每页条数     * @return com.github.pagehelper.Page     */    public Page findAll(Integer currentPage, Integer pageSize) {        //设置分页        Page page= PageHelper.startPage(currentPage,pageSize);        // 查问全副        List<ZiLiao> all = ziLiaoDao.findAll();        return  page;    }}

5、contraller层，获取页面传过来的参数（当前页，每页显示多少条数据），而后调用service层的办法，返回一个page对象，依据这个page对象再封装一个PageInfo对象，最初把PageInfo转成json格局返回页面即可。

ZiLiaoController.java

@RestControllerpublic class ZiLiaoController {@Autowiredprivate ZiLiaoService ziLiaoService;@RequestMapping("findAll")public String getAll(Integer currentPage, Integer pageSize) throws IOException {//分页查问Page page = ziLiaoService.findAll(currentPage, pageSize);//封装PageInfoPageInfo info = new PageInfo(page);//将info转成json，响应给客户端String json = new ObjectMapper().writeValueAsString(info);return json; }}

前端代码

index.html

methods:{            //分页查问性能            selectByPage(){                axios.post("findAll","currentPage=" + this.pagination.currentPage + "&pageSize=" + this.pagination.pageSize)                    .then(resp => {                        //将查问出的数据赋值tableData                        this.tableData = resp.data.list;                        //设置分页参数                        //当前页                        this.pagination.currentPage = resp.data.pageNum;                        //总条数                        this.pagination.total = resp.data.total;                    })            },            //扭转每页条数时执行的函数            handleSizeChange(pageSize) {                //批改分页查问的参数                this.pagination.pageSize = pageSize;                //从新执行查问                this.selectByPage();            },            //扭转页码时执行的函数            handleCurrentChange(pageNum) {                //批改分页查问的参数                this.pagination.currentPage = pageNum;                //从新执行查问                this.selectByPage();            }        },        mounted(){            //调用分页查问性能            this.selectByPage();        }

残缺源码下载地址：https://gitee.com/xuxiaofei19...

如果你在运行这个代码的过程中有遇到问题，请加小编vi信xxf960513，！帮忙你疾速把握这个性能代码！