用thinkphp5.1 写一个layui 分页功能
时间: 2023-07-15 12:15:01 浏览: 286
酒店管理系统thinkphp5.1+layui
5星 · 资源好评率100%
好的,下面是使用thinkphp5.1和layui实现分页的步骤:
1. 安装layui和thinkphp5.1
在项目根目录下使用composer安装layui和thinkphp5.1:
```
composer require topthink/think:5.1.* -vvv
composer require layui/layui
```
2. 创建控制器和视图文件
在控制器中定义一个方法用于获取数据和渲染视图:
```php
namespace app\index\controller;
use think\Controller;
use think\Db;
class Index extends Controller
{
public function index()
{
// 获取数据
$list = Db::name('user')->paginate(10);
// 渲染视图
$this->assign('list', $list);
return $this->fetch();
}
}
```
在视图文件中使用layui的分页组件:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>分页演示</title>
<link rel="stylesheet" href="/static/layui/css/layui.css">
</head>
<body>
<div class="layui-container">
<table class="layui-table">
<thead>
<tr>
<th>ID</th>
<th>姓名</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
{volist name="list" id="vo"}
<tr>
<td>{$vo.id}</td>
<td>{$vo.name}</td>
<td>{$vo.age}</td>
</tr>
{/volist}
</tbody>
</table>
<div id="page"></div>
</div>
<script src="/static/layui/layui.js"></script>
<script>
layui.use(['laypage', 'layer'], function(){
var laypage = layui.laypage;
var layer = layui.layer;
// 初始化分页组件
laypage.render({
elem: 'page',
count: {$list.total},
limit: {$list.list_rows},
curr: {$list.current_page},
jump: function(obj, first){
if(!first){
// 点击分页按钮时触发的回调函数
window.location.href = '?page=' + obj.curr;
}
}
});
});
</script>
</body>
</html>
```
3. 实现分页功能
在控制器中获取分页数据:
```php
namespace app\index\controller;
use think\Controller;
use think\Db;
class Index extends Controller
{
public function index()
{
// 获取当前页码
$page = $this->request->get('page', 1);
// 获取分页数据
$list = Db::name('user')->paginate(10, false, ['page' => $page]);
// 渲染视图
$this->assign('list', $list);
return $this->fetch();
}
}
```
在视图文件中根据当前页码显示对应的数据:
```html
<tbody>
{volist name="list" id="vo"}
<tr>
<td>{$vo.id}</td>
<td>{$vo.name}</td>
<td>{$vo.age}</td>
</tr>
{/volist}
</tbody>
```
然后在分页组件的回调函数中设置跳转链接:
```js
jump: function(obj, first){
if(!first){
// 点击分页按钮时触发的回调函数
window.location.href = '?page=' + obj.curr;
}
}
```
这样就可以实现使用thinkphp5.1和layui实现分页功能了。
阅读全文