必须用table.on('toolbar(表ID)')监听lay-event，不可直接绑定click；切换时需reload()传入当前page/where/initSort等状态参数，并调用table.resize()重算列宽。
工具栏按钮怎么绑定紧凑/宽松切换事件
直接在 toolbar 配置里加一个自定义按钮，用 lay-event 绑定事件名（比如 toggledensity），然后在 table.on('tool(你的tableid)') 里监听它。别用 click 直接绑 dom——layui 的工具栏是动态渲染的，事件委托才是可靠写法。
- 按钮 HTML 示例：
<button class="layui-btn layui-btn-sm" lay-event="toggleDensity">切换紧凑模式</button> - 监听逻辑里要区分当前状态，建议用全局变量或
data-属性存状态，比如document.querySelector('#yourTableId').dataset.density = 'compact' - 避免重复初始化：切模式时不要调
table.render()，只用table.reload()+ 关键配置重载
reload 时必须传哪些参数才能不丢状态
只改 cellMinWidth 和 size 不够，reload() 会重置分页、排序、搜索条件。常见现象是：一按切换按钮，表格跳回第 1 页、排序箭头消失、搜索框清空——根本原因是没把当前上下文带进去。
-
page: { curr: table.cache['yourTableId']?.page?.curr || 1 }必须显式传，否则默认回第 1 页 -
where: table.cache['yourTableId']?.where || {}要同步，不然搜索/筛选条件丢失 -
initSort: table.config?.initSort || null得带上，否则前端排序图标不显示，后端也收不到sort参数 - 如果用了
height: 'full-xx'，切换时最好也重传一次，避免容器高度计算错位
紧凑模式下哪些样式参数最影响效果
真正起作用的是三个组合： size: 'sm' 控制整体尺寸基线，cellMinWidth 决定列最小宽度下限，lineStyle 直接压行高。光设 size 不够，因为默认 cellMinWidth: 100 会把“姓名”两个字撑成 100px 宽；光调 lineStyle 也不行，表头和内容行高不同步会导致对不齐。
- 紧凑推荐值：
size: 'sm'+cellMinWidth: 40+lineStyle: 'height: 32px;' - 宽松推荐值：
size: 'lg'+cellMinWidth: 120+lineStyle: 'height: 48px;' - 注意：
lineStyle是 Layui 2.7+ 才支持，低版本只能靠 CSS 覆盖.layui-table tbody tr - 如果列里有
templet自定义内容，记得在模板里加style="padding: 2px 6px;"对齐内边距
切换后列宽错乱、文字换行异常怎么办
这不是 reload 没生效，而是 Layui 内部列宽缓存没刷新。特别是当列配置里混用了 width 和 minWidth，或者某列用了 templet 渲染富文本，reload 后列宽不会自动重算——它只按初始渲染时的首屏数据估算。
- 切完模式后必须立刻调
table.resize('yourTableId')，强制重排列宽 - 如果用了固定列（
fixed: true），resize 后还得补一句$('#yourTableId').closest('.layui-table-box').trigger('scroll')，否则固定列位置漂移 - 文字被截断（显示
…）？检查是否漏了white-space: normal—— 在列templet里包一层<div style="white-space: normal; word-break: break-word;">{{d.xxx}}</div> - Tab 页里嵌表格？确保切换到该 Tab 后再触发 reload + resize，否则容器
display: none导致尺寸读为 0
table.resize() 的调用时机——它必须在 reload() 的 success 回调里执行，不能并行或提前。否则表格 DOM 还没更新完，resize 就去读旧结构，列宽还是错的。
