thinkphp8+layui分页

前端

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>demo</title>
  <link href="//unpkg.com/layui@2.9.20/dist/css/layui.css" rel="stylesheet">
</head>
<body>
<table class="layui-table">
  <colgroup>
    <col width="150">
    <col width="150">
    <col>
  </colgroup>
  <thead>
  <tr>
    <th>ID</th>
    <th>realname</th>
    <th>gender</th>
  </tr>
  </thead>
  <tbody>
  {volist name="data" id="vo"}
  <tr>
    <td>{$vo.id}</td>
    <td>{$vo.realname}</td>
    <td>{$vo.sex}</td>
  </tr>
  {/volist}
  </tbody>
</table>
<div id="demo-laypage-all"></div>
<script src="//unpkg.com/layui@2.9.20/dist/layui.js"></script>
<script>
  layui.use(function(){
    const laypage = layui.laypage;
    // 完整显示
    laypage.render({
      elem: 'demo-laypage-all', // 元素 id
      theme: '#1E9FFF',
      count: 100, // 数据总数
      curr:{$page},
      layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'], // 功能布局
      jump: function(obj, first){
        console.log(obj);
        if(!first){
          window.location.href='?page='+obj.curr;
        }
      }
    });
  });
</script>
</body>
</html>

后端:

php 复制代码
public function index()
    {
        $page = input('get.page/d'); // 当前页码
        $result = Db::name('user')->paginate([
            'list_rows'=> 10,
            'page' => $page
        ]);
        return view('/index',['data'=>$result,'page'=>$page]);
    }
相关推荐
_瑞1 分钟前
深入理解 iOS 渲染原理
前端·ios
IT_陈寒4 分钟前
SpringBoot自动配置失灵?你可能忘了这个关键注解
前端·人工智能·后端
iCOD3R42 分钟前
Skill - kill-ai-slop 解决“AI 味”样式
前端·css·ai编程
皮音1 小时前
Skill 在项目中的实践 —— 从 Agent 困境到 Skill 工程化
前端
大龄秃头程序员1 小时前
RN 0.86 新架构实战:TurboModule + Fabric 组件 + iOS 原生容器,完整代码开源
前端·react native
这是个栗子1 小时前
前端开发中的常用工具函数(八)
开发语言·前端·javascript
Hilaku1 小时前
Vue 和 React 真正的差距,不在语法,而在团队犯错成本
前端·javascript·程序员
研☆香2 小时前
为什么变量声明在赋值前也能使用?—— 深入理解 JavaScript 变量提升与作用域
开发语言·前端·javascript
Liora_Yvonne2 小时前
目录结构到底怎么设计?别再把 components 和 utils 当垃圾桶了
前端
柯克七七2 小时前
我把 bug 修得太干净了,测试组以为这个模块本来就没问题
前端·javascript·typescript