Layui表格动态改每页条数必须用table.reload()传完整page对象（含limit和curr），因limit初始化后不监听变化、setOptions不存在、外层limit被忽略、destroy+render丢失状态；自定义按钮需监听分页下拉change事件或维护currentLimit变量。
必须用 table.reload() 传入完整 page 对象，不能只改 limit 字段或调用 destroy + render。
为什么直接改配置或 setOption 不生效
Layui 表格的 limit 是初始化时一次性读取的，后续不会监听外部变量变化；table.render() 只在首次执行，重复调用会报“重复渲染”错误；table.setOptions() 并不存在——Layui 没提供这个 API。
- 把
limit: pageSize写在page外层（如和url并列）→ 完全被忽略，静默 fallback 到 30 - 只传
{ page: { limit: 50 } }给reload()，但没带curr→ 当前页码不变，但若新limit导致总页数变少（比如原第 8 页只剩 3 页），UI 可能卡死或空白 - 用
table.destroy('id')后重新render()→ 工具栏事件、排序状态、已绑定的tool/row回调全部丢失，且 DOM 可能残留
table.reload() 的正确调用方式
它才是动态改每页条数的唯一合规路径，且会保留所有原始配置（cols、url、request、done 等），只覆盖你显式传入的部分。
- 必须传完整
page对象：page: { limit: 25, curr: 1 }——curr: 1推荐加上，避免用户在第 5 页切到每页 100 条后还卡在无效页码 - 如果当前页码需保持（比如仅调整条数不重置浏览位置），可省略
curr，但要确保后端返回的count正确，否则页码栏计算错乱 - 若同时带搜索条件，
where必须一并传入，否则 reload 后条件丢失：where: { keyword: $('#kw').val() } - 示例：
table.reload('demo', { page: { limit: 20, curr: 1 }, where: { status: 'active' } });
如何让按钮点击后自动取当前下拉选中值
用户手动点分页下拉时，Layui 会自动触发 reload 并带上新 limit，但自定义按钮（如“导出全部”“切换紧凑模式”）需要你手动读值。
- 不要用
$('select[lay-id="demo"]')直接查 DOM —— 这个 select 是 Layui 动态生成的，class 和结构不稳定 - 正确做法：维护一个变量（如
let currentLimit = 10;），在done回调里更新它：done: (res, curr, count) => { currentLimit = res.limit || currentLimit; } - 或者从表格实例取：
const tableIns = table.get('demo'); console.log(tableIns.config.page.limit);—— 注意tableIns.config是只读快照，不实时反映 UI 切换后的值 - 最稳妥：监听分页下拉的 change 事件（需在 render 后加）：
$(document).on('change', 'select[name="limit"]', function(){ currentLimit = parseInt(this.value); });
容易被忽略的兼容性细节
动态改 limit 看似简单，但几个底层约束不满足就会静默失败：
-
limit必须是正整数，25.0或"25"都会导致 fallback 到默认 30 - 如果用了
request: { limitName: 'pageSize' }，reload时不用重复写，它已固化在表格实例里 - 移动端小屏下，若
limits数组超过 4 个选项（如[5, 10, 20, 50, 100]），新limit虽然生效，但下拉弹层可能被截断，用户无法看到刚选的值 - 如果后端响应的
count字段名不是count（如叫total），且没配response: { countName: 'total' }，则页码总数不更新，reload 后分页栏显示异常
