layui中分页插件怎么使用
时间: 2023-12-03 10:42:04 浏览: 64
在layui中使用分页插件需要引入 `layui.laypage` 模块。具体使用步骤如下:
1. 引入 `layui.laypage` 模块
```html
<script src="https://cdn.bootcdn.net/ajax/libs/layui/2.5.6/layui.js"></script>
```
2. 在需要使用分页的地方添加一个 `div` 标签,并设置一个 `id` 属性
```html
<div id="demo"></div>
```
3. 编写 javascript 代码,初始化分页插件
```javascript
layui.use(['laypage'], function(){
var laypage = layui.laypage;
//执行一个laypage实例
laypage.render({
elem: 'demo', //注意,这里的 demo 是 ID,不用加 # 号
count: 50, //数据总数,从服务端得到
limit: 10, //每页显示的条数
jump: function(obj, first){
//obj包含了当前分页的所有参数,比如:
console.log(obj.curr); //得到当前页,以便向服务端请求对应页的数据。
console.log(obj.limit); //得到每页显示的条数
//首次不执行
if(!first){
//do something
}
}
});
});
```
其中,`elem` 属性的值为 `demo`,这个值要与前面 `div` 标签的 `id` 属性保持一致。
`count` 属性表示数据总数,这个值需要从服务端获取。`limit` 属性表示每页显示的条数。
`jump` 属性为回调函数,每次分页时会调用该函数。其中,`obj.curr` 表示当前页码,`obj.limit` 表示每页显示的条数。在回调函数中,可以根据 `obj.curr` 和 `obj.limit` 发送请求获取对应的分页数据,并进行展示。
以上就是 layui 中分页插件的使用方法。
阅读全文