关于MyBatis的分页

1第一种写法

首先我们需要一个配置类

分页拦截器

package com.wjh.login.config;

import com.baomidou.mybatisplus.annotation.DbType;
import com.baomidou.mybatisplus.extension.plugins.MybatisPlusInterceptor;
import com.baomidou.mybatisplus.extension.plugins.inner.BlockAttackInnerInterceptor;
import com.baomidou.mybatisplus.extension.plugins.inner.PaginationInnerInterceptor;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

@Configuration
public class MyBatisConfig {
    @Bean
    public MybatisPlusInterceptor mybatisPlusInterceptor() {
        MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
        // 分页插件
        interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL));
        // 防止全表更新和删除
        interceptor.addInnerInterceptor(new BlockAttackInnerInterceptor());
        return interceptor;
    }

}

在后台写法如下

public Result list(@RequestParam(defaultValue = "1") Integer current,
                       @RequestParam(defaultValue = "5") Integer size, User user){
        QueryWrapper queryWrapper = new QueryWrapper();
        if (!Objects.isNull(user)){
            queryWrapper.like(StrUtil.isNotBlank(user.getUsername()),"username",user.getUsername());
            queryWrapper.or(StrUtil.isNotBlank(user.getUsername())&&StrUtil.isNotBlank(user.getMobile()));
            queryWrapper.like(StrUtil.isNotBlank(user.getMobile()),"mobile",user.getMobile());
        }
        Page<User> pager = userService.page(new Page(current,size),queryWrapper);
        return new Result(true,StatusCode.OK,"用户列表",pager);
    }

在前台的写法

<template>
  <div class="home">
    <el-form :inline="true" :model="formData" class="demo-form-inline">
      <el-form-item label="账号">
        <el-input v-model="formData.username" placeholder="账号"></el-input>
      </el-form-item>
      <el-form-item label="手机号">
        <el-input v-model="formData.mobile" placeholder="手机号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="getList">查询</el-button>
      </el-form-item>
    </el-form>
    <el-table
            :data="tableData"
            style="width: 100%">
      <el-table-column
              prop="id"
              label="用户编号">
      </el-table-column>
      <el-table-column
              prop="username"
              label="账号">
      </el-table-column>
      <el-table-column
              prop="mobile"
              label="手机号">
      </el-table-column>
      <el-table-column
              prop="birthday"
              label="生日"
              :formatter="formatDate">
      </el-table-column>
    </el-table>
    <el-pagination
            background
            @current-change="changePage"
            :page-size="pager.size"
            layout="total,prev, pager, next,jumper"
            :total="pager.total">
    </el-pagination>
  </div>
</template>

<script>
// @ is an alias to /src

export default {
  name: 'HomeView',
  data(){
    return{
      tableData:[],
      pager:{},

      formData:{
        username:'',
        mobile:''
      }
    }
  },
  methods:{
    changePage(obj){
      console.log(obj);
      this.formData.current=obj;
      this.$http.get("/user/list",{params:this.formData}).then(resp=>{
        this.pager=resp.data.data;
        this.tableData=resp.data.data.records;
      })
    },
    getList(){
      this.$http.get("/user/list",{params:this.formData}).then(resp=>{
        this.pager=resp.data.data;
        this.tableData=resp.data.data.records;
      })
    },
    formatDate:function(row, column){
      let data = row[column.property]
      if(data == null) {
        return null
      }
      let date = new Date(data);
      let o = {
        "M+" : date.getMonth()+1,                 //月份
        "d+" : date.getDate(),                    //日
        "h+" : date.getHours(),                   //小时
        "m+" : date.getMinutes(),                 //分
        "s+" : date.getSeconds(),                 //秒
        "q+" : Math.floor((date.getMonth()+3)/3), //季度
        "S"  : date.getMilliseconds()             //毫秒
      };
      let fmt = "yyyy-MM-dd";
      if(/(y+)/.test(fmt)) {
        fmt=fmt.replace(RegExp.$1, (date.getFullYear()+"").substr(4 - RegExp.$1.length));
      }
      for(let k in o) {
        if(new RegExp("("+ k +")").test(fmt)){
          fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
        }
      }
      return fmt ;
    }
  },
  created() {
    this.getList();
  }
}
</script>