mybaties_plus分页实现——1

建议用postman，这个是真的好用！

首先，要有一个配置，配置好mybaties_plus默认的分页

package cn.edu.seu.l_mall.config;

import com.baomidou.mybatisplus.extension.plugins.PaginationInterceptor;
import com.baomidou.mybatisplus.extension.plugins.pagination.optimize.JsqlParserCountOptimize;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.transaction.annotation.EnableTransactionManagement;

@EnableTransactionManagement
@Configuration
@MapperScan("cn.edu.seu.l_mall.*.mapper")
public class MybatisPlusConfig {

    @Bean
    public PaginationInterceptor paginationInterceptor() {
        PaginationInterceptor paginationInterceptor = new PaginationInterceptor();
        // 设置请求的页面大于最大页后操作， true调回到首页，false 继续请求  默认false
         paginationInterceptor.setOverflow(true);
        // 设置最大单页限制数量，默认 500 条，-1 不受限制
        paginationInterceptor.setLimit(3);
        paginationInterceptor.setCountSqlParser(new JsqlParserCountOptimize(true));
        return paginationInterceptor;
    }
}


2.在CategoryController加入接收前端数据的函数（接收分页信息等。。。）

@GetMapping("/categories")//与listCategroy.html有关
public IPage<Category> list(@RequestParam(value = "start", defaultValue = "1") int start, @RequestParam(value = "size", defaultValue = "5") int size) throws Exception {

    IPage<Category> page = new Page<Category>(start, 3);  //（当前页，页大小）
    IPage<Category> page1 = categoryService.page(page);
      return page1;
}
3.用postman测试

 成功！目前只是成功返回了分页数据，具体的跳转页面操作还没做。

补充一下，前端这么写：不能放全部代码，见谅

 $(function(){
        var dataVue = {//是JSON数据//数据，JSON类型
            uri:'categories',
            beans: [],
            bean: { id: 0, name: ''},//分类信息，就是这个页面上的
            pagination:{},
            file: null//上传的文件
        };

        //ViewModel
        var vue = new Vue({//注意大写V，把id对应的元素与JSON数据关联起来
            el: '#workingArea',//id
            data: dataVue,
            mounted:function(){ //mounted　表示这个 Vue 对象加载成功了
                this.list(0);
            },
            methods: {
                list:function(start){

                    var url =  this.uri+ "?start="+start;

                    axios.get(url).then(function(response) {
                        vue.pagination = response.data;
                        vue.beans = response.data.records;
                    });
                },
                add: function () {//增加和删除操作与分页无关，不展示了
                  

                },
                deleteBean: function (id) {//delete是保留字。只能用deletebean
                   
                },




                getFile: function (event) {
                    this.file = event.target.files[0];
                },
                jump: function(page){
                    jump(page,vue); //定义在adminHeader.html 中
                },
                jumpByNumber: function(start){
                    jumpByNumber(start,vue);
                }

            }
        });
    });