laypage可独立使用，只需引入layui.js和layui.css，调用layui.laypage.render()即可；elem参数不支持“#”前缀，jump回调需用first判断避免重复请求，count须准确反映总数据量。
layui 的 laypage 可以完全脱离 layui 其他模块单独使用，只要引入 layui.js 和 layui.css，再按需调用 laypage.render() 即可——它不依赖 jquery、不强制要求表单或表格结构，也不是“必须配合 laytpl 才能渲染数据”。
如何最小化引入并初始化 laypage
很多人卡在第一步：以为要加载整个 layui.all.js 或必须用 layui.use() 异步加载。其实不是。
-
laypage是 layui 的内置模块，但它的核心逻辑已随layui.js一起打包，只要页面加载了layui.js，layui.laypage就可用 - 不需要
jquery（2025 年起 layui 已移除对 jQuery 的依赖） - 不需要提前写
<script type="text/html"></script>模板——laypage只管生成页码 DOM，数据渲染由你自己的逻辑控制 - 最简 HTML 结构只需一个空容器：
<div id="pagination"></div>
示例代码：
layui.laypage.render({
elem: 'pagination',
count: 123,
limit: 10,
curr: 1,
jump: function(obj) {
console.log('当前页：', obj.curr); // 用于触发你的数据加载逻辑
}
});为什么 elem 不能带 # 号
这是新手最高频的报错点：Uncaught TypeError: Cannot read property 'innerHTML' of null，根源就是传了 elem: '#pagination'。
-
laypage.render()的elem参数只接受两种值：String（ID 名，不带#）或HTMLElement（DOM 对象） - 传
'#pagination'会被当作文本字符串处理，laypage 尝试用它当 ID 去document.getElementById()，结果得到null - 正确写法是
elem: 'pagination'或elem: document.getElementById('pagination')
jump 回调里怎么安全加载新页数据
jump 不是只执行一次，而是每次页码切换（包括首次渲染、点击跳页、手动输入页码）都会触发。容易忽略的是 first 参数——它标识是否为首次渲染。
- 如果在
jump中无条件发起 AJAX，首次渲染时会重复请求第 1 页两次（一次是 render 自动触发，一次是你手动调的） - 应通过
if (!first) { /* 加载数据 */ }过滤掉首次自动调用 -
obj.curr和obj.limit是实时参数，直接用于后端分页参数，别硬编码page=1 - 若需带搜索条件，把条件变量闭包进
jump函数内，避免从全局取值导致状态不同步
服务端分页 vs 前端静态分页的边界在哪
有人试图用 laypage 对前端数组做“全量分页”，数据一过千就卡顿。这不是 laypage 的问题，是误用了场景。
-
laypage本身不处理数据切片，它只生成页码栏；所谓“前端分页”，实际是你自己在jump里用slice()截取数组 - 真实项目中，>100 条数据就该交由后端分页（减少传输、避免内存堆积、支持排序/过滤下推）
- 若真要做前端分页，务必加防抖 + 缓存原始数组，否则快速点页码会触发多次
slice和重绘 -
count必须准确——它决定总页数显示。前端分页时，count = data.length；服务端分页时，count必须来自接口返回的total字段，不能靠data.length算
真正难的从来不是怎么写那几行 render()，而是想清楚数据谁来切、状态谁来管、错误谁来兜底——laypage 只负责把“第几页”这个信号干净地递出去。
