分页插件pageInfo

 <ul class="pagination">
<!--                              preActive true 没有上一页         -->
                                <li class="page-item" v-bind:class="{disabled:preActive}">
                                    <a class="page-link" href="javascript:void(0)" v-on:click="loadTable(pageInfo.pageNum-1)">上一页</a>
                                </li>

                                <li class="page-item ">
                                    <a class="page-link" v-if="pageInfo.pageNum >1 " href="javascript:void(0)"
                                    v-on:click="loadTable(pageInfo.pageNum - 1)">{{pageInfo.pageNum - 1}}</a>
                                </li>

                                <li class="page-item disabled">
                                    <a class="page-link" href="javascript:void(0)">{{pageInfo.pageNum}}</a>
                                </li>

                                <li class="page-item ">
                                    <a class="page-link" v-if="pageInfo.hasNextPage" href="javascript:void(0)"
                                       v-on:click="loadTable(pageInfo.pageNum + 1)">{{pageInfo.pageNum + 1}}</a>
                                </li>

                                <li class="page-item" v-bind:class="{disabled:nextActive}">
                                    <a class="page-link" href="javascript:void(0)"
                                       v-on:click="loadTable( pageInfo.hasNextPage ? (pageInfo.pageNum+1) :pageInfo.pageNum)">下一页</a>
                                </li>

                            </ul>

data:{
   
            pageInfo:{},
            preActive:true,        //有上一页 false  没有 true
            nextActive:true ,         //有上一页 false  没有 true
           
        },
            
        loadTable(pageNum){

                let name = this.name ==='' ? 'all' : this.name;

                axios.get("/goodsInfo/page/"+name+"?pageNum="+pageNum).then(res =>{
/*                   res.data 返回值  枚举类  code 0 认为函数执行成功             */
                    if(res.data.code ==='0'){
                        this.objs=res.data.data.list;
                        this.pageInfo=res.data.data;
                        this.preActive=!(this.pageInfo.hasPreviousPage);     //hasPreviousPage是否有上一页
                        this.nextActive=!(this.pageInfo.hasNextPage);         // hasNextPage是否有xia一页
                    }else {
                        msg('error',res.data.msg);
                    }

                })
            },
            
            
            

 public PageInfo<GoodsInfo> findPage(Integer pageNum, Integer pageSize, String name){
        //封装
        PageHelper.startPage(pageNum,pageSize);
        List<GoodsInfo> list=goodsInfoMapper.findByName(name,null);
        return PageInfo.of(list);
    }


List<GoodsInfo> findByName(@Param("name") String name,@Param("id") Long id);


  @GetMapping("/page/{name}")
    public Result<PageInfo<GoodsInfo>> page(@RequestParam(defaultValue = "1") Integer pageNum,
                                            @RequestParam(defaultValue = "10") Integer pageSize,
                                            @PathVariable String name){
        return Result.success(goodsInfoService.findPage(pageNum,pageSize,name));
    }

<select id="findByName" resultType="com.javaclimb.xshopping.entity.GoodsInfo">
    select *,
           (select ty.name from type_info ty where ty.id=g.typeId) typeName,
           (select u.name from user_info u where u.id=g.userId) userName
           from goods_info g where 1=1


    <if test="name !=null and name !='all' and name !=''">
      and g.`name` like concat('%',#{name},'%')
    </if>
    <if test="id !=null and id !=''">
      and g.`id`=#{id}
    </if>
  </select>