1.controller

//接口路径：/user/page?pageNum=1&pageSize=10
    //分页接口
    //@RequestParam接受
    //limit第一个参数：pageNum = (pageNum -1) * pageSize;
@GetMapping("/page")
    public Map<String,Object> findPage(@RequestParam Integer pageNum,
                               @RequestParam Integer pageSize,
                                       @RequestParam
                                       String username){
        pageNum = (pageNum -1) * pageSize;
        username = "%"+username+"%";
        List<User> data = userMapper.selectPage(pageNum,pageSize,username);
          Integer total =  userMapper.selectTotal(username);
          Map<String,Object> res = new HashMap<>();
          res.put("data",data);
          res.put("total",total);
        return res;
    }

2.usermapper

 @Select("select * from user where username like #{username} limit #{pageNum},#{pageSize}")
    List<User> selectPage(Integer pageNum, Integer pageSize, String username);

    @Select("select count(*) from user where username like #{username}")
    Integer selectTotal(String username);

3.前台:

methods:{
    load(){
        //fetch api请求查询
        fetch("http://localhost:9090/user/page?pageNum="+this.pageNum+"&pageSize="+this.pageSize+"&username="+this.username).then(res => res.json()).then(res =>{
          console.log(res);
          this.userList=res.data;
          this.total = res.total;
        })
        }
}

4.直接调用load方法即可