layui的分页

  layui的分页需要后台配合，这边我使用的是pagehelper

       

  @RequestMapping("findGoods")
    private String findGoods(Integer cateId, String goodsName,Integer pageNum,Integer pageSize) {
        JSONObject json = new JSONObject();
        PageHelper.startPage(pageNum,pageSize);
        List<Goods> goods;
        if (cateId == null && StringUtils.isBlank(goodsName)) {
            goods = goodsService.findGoods();
        } else {
            goods = goodsService.findGoods(cateId, goodsName);
        }
        PageInfo<Goods> personPageInfo = new PageInfo<>(goods);
        json.put("code",0);
        json.put("msg","");
        json.put("count",personPageInfo.getTotal());
        json.put("data",personPageInfo.getList());
        return json.toString();
    }

     pageHelper 使用原理不在此赘述了，但是注意一点就是PageHelper.startPage(pageNum,pageSize);，这句代码要写在执行查询操作之前

      layui本身会在table请求传递page 和Limite，但是如此一来我们在点击下一页是page 和limit还会是1和10 所以需要手动设置，而且后台需要返回必须返回count值，用来计算总条数

         

   table.render({
            elem: '#goods-table',
            url: "/Goods/findGoods?cateId=" + cateId + "&goodsName=" + name+"&pageNum="+pageNum+"&pageSize="+pageSize,
            cellMinWidth: 80,
            toolbar: '#barTop',
            cols: [[
                {type: 'checkbox', fixed: 'left'},
                {field: 'goId', title: 'ID', sort: true, align: 'center'},
                {field: 'goodsId', title: '产品编码', sort: true, align: 'center'},
                {field: 'modelnum', title: '产品型号', align: 'center'},
                {field: 'goodsName', title: '产品名称', align: 'center'},
                {field: 'categoryName', title: '分类名称', align: 'center'},
                {field: 'price', title: '展示价格', sort: true, align: 'center'},
                {
                    field: 'isDefault', title: '是否默认', sort: true, align: 'center', templet: function (d) {
                        return d.isDefault == 0 ? "否" : "是";
                    }
                },
                {fixed: 'right', title: "操作", align: 'center', toolbar: '#curd'}
            ]],
            done: function (res) {
                laypage.render({
                    elem: 'goods-page',
                    count: res['count'],
                    curr:pageNum,
                    limit: pageSize,
                    layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
                    jump: function (obj, first) {
                        if (first) {
                            return;
                        }
                        initTable(obj.curr, obj.limit,cateId,name);
                    }
                });
            },
        });

   按照上面即可完成分页

转载于:https://www.cnblogs.com/fmlyzp/p/10663321.html