layui-laytable分页

本文探讨了laytable分页中遇到的问题,解释了laytable的分页默认触发异步数据请求并回调load事件,无需额外设置jump回调。通过request参数可以自定义请求键值对,如需改变页数参数,可以新增后台接口参数。layui 2.1.0版本新增了request和response设置,使得参数定制更为灵活。官方文档提供了更多详细信息。
摘要由CSDN通过智能技术生成


layui 版本:2.5.6
一切不带版本的问题都是耍流氓

问题:laytable的分页无法回调怎么分?

laytable的分页是无法设置回调函数 jump属性的,
这是因为page已经默认了会触发 异步数据请求接口 并回调laytableload事件。
也就是我们不需要在手动写jump回调函数,不是laytable不行,而是他已经写好了。
此时的请求参数有默认的pagelimit

page: 当前页数
limit:页面数据条数,默认值是10。
意思就是你不设置值的话,他初次是往后台发出查询10条的请求的,可能会与你的limits[12,22,32]设置
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,这是一个基于SSM框架和layui前端框架实现的分页实例: 首先,在Maven中引入相关依赖: ```xml <!-- Spring --> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-webmvc</artifactId> <version>5.2.5.RELEASE</version> </dependency> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-jdbc</artifactId> <version>5.2.5.RELEASE</version> </dependency> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-tx</artifactId> <version>5.2.5.RELEASE</version> </dependency> <!-- MyBatis --> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis</artifactId> <version>3.5.4</version> </dependency> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis-spring</artifactId> <version>2.0.4</version> </dependency> <!-- C3P0 --> <dependency> <groupId>c3p0</groupId> <artifactId>c3p0</artifactId> <version>0.9.5.5</version> </dependency> <!-- layui --> <dependency> <groupId>com.layui</groupId> <artifactId>layui</artifactId> <version>2.5.6</version> </dependency> ``` 接着,创建一个实体类`User`,对应数据库中的`user`表: ```java public class User { private Integer id; private String name; private Integer age; //省略getter/setter方法 } ``` 然后,创建DAO层接口`UserMapper`,以及对应的XML文件`UserMapper.xml`,实现分页查询: ```java public interface UserMapper { List<User> getUserList(@Param("start") Integer start, @Param("pageSize") Integer pageSize); Integer getUserCount(); } ``` ```xml <select id="getUserList" resultType="User"> select * from user limit #{start},#{pageSize} </select> <select id="getUserCount" resultType="Integer"> select count(*) from user </select> ``` 再创建Service层接口`UserService`及其实现类`UserServiceImpl`,调用DAO层方法实现业务逻辑: ```java public interface UserService { PageInfo<User> getUserList(Integer pageNum, Integer pageSize); } @Service public class UserServiceImpl implements UserService { @Autowired private UserMapper userMapper; @Override public PageInfo<User> getUserList(Integer pageNum, Integer pageSize) { PageHelper.startPage(pageNum, pageSize); List<User> userList = userMapper.getUserList((pageNum - 1) * pageSize, pageSize); PageInfo<User> pageInfo = new PageInfo<>(userList); int totalCount = userMapper.getUserCount(); pageInfo.setTotal(totalCount); return pageInfo; } } ``` 最后,创建Controller类`UserController`,处理前端请求并返回分页数据: ```java @Controller public class UserController { @Autowired private UserService userService; @RequestMapping("/user/list") @ResponseBody public TableResult<User> getUserList(@RequestParam(value = "page", defaultValue = "1") Integer pageNum, @RequestParam(value = "limit", defaultValue = "10") Integer pageSize) { PageInfo<User> pageInfo = userService.getUserList(pageNum, pageSize); TableResult<User> result = new TableResult<>(); result.setCode(0); result.setMsg(""); result.setCount(pageInfo.getTotal()); result.setData(pageInfo.getList()); return result; } } ``` 其中,`TableResult`是一个通用的分页返回结果类: ```java public class TableResult<T> { private Integer code; private String msg; private Long count; private List<T> data; //省略getter/setter方法 } ``` 最后,在前端页面中引入layui分页组件: ```html <table id="userTable" lay-filter="userTable"></table> <script type="text/html" id="barDemo"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </script> <script> layui.use(['table', 'layer'], function () { var table = layui.table; var layer = layui.layer; table.render({ elem: '#userTable', url: '/user/list', method: 'get', page: true, cols: [[ {field: 'id', title: 'ID', width: 70}, {field: 'name', title: '姓名', width: 120}, {field: 'age', title: '年龄', width: 70}, {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 150} ]] }); }); </script> ``` 这样,一个基于SSM和layui分页实例就完成了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值