根本原因是display:none使offsetWidth等API返回0，导致列宽计算跳过、表体不生成、分页栏缺失；须待容器重排完成（offsetWidth>0且display≠'none'）后调用table.render()或resize()。
为什么表格在 display: none 的容器里 render() 后不显示
根本原因是 layui 表格初始化时依赖 offsetwidth、getboundingclientrect() 等 api 获取容器尺寸，而 display: none 下这些值恒为 0，导致列宽计算跳过、表体不生成 <tr>、分页栏缺失——不是报错，是“静默失败”。常见于 tab 面板、折叠区、modal 初始隐藏状态。
<h3>Tab 激活后安全调用 table.render() 的时机判断</h3>
<p>不能靠 <code>tabChange 或 setTimeout(0)，必须等容器真正重排完成。可靠做法是轮询检测：
- 目标元素必须是表格容器本身（如
document.getElementById('table-demo')），不是 Tab 面板 - 同时满足两个条件才执行：
el.offsetWidth > 0且getComputedStyle(el).display !== 'none' - 用
requestAnimationFrame轮询（比setTimeout更准），最多 30 帧（约 500ms），避免死等 - 已 render 过的表格，必须先
layui.table.destroy('your-table-id')，否则重复 init 报Table ID has been used
用 visibility: hidden 替代 display: none 的陷阱
看似保留了尺寸，但实际仍不可行：
-
visibility: hidden下getBoundingClientRect()返回{width: 0, height: 0}，Layui 内部仍判为无宽可算 - 即使手动调
table.resize()，固定列（fixed: true）因scrollWidth === 0无法定位，依然错位 - 真正有效的替代方案是：初始用
opacity: 0; pointer-events: none+ 显式设宽高，或直接预渲染 +layui-show控制显隐
初始化前规避隐藏渲染的硬约束
如果无法改变容器显隐逻辑，就得从配置源头减少对尺寸的依赖：
- 每列必须设固定
width（如{field: 'name', width: 120}），禁用自动分配 - 关闭
autoResize: false，防止 Tab 切换时误触发重排干扰布局 - 确保外层有
<div class="layui-table-box">，且其父级有明确宽度（如 <code>width: 1200px或max-width: 100%+ 上层定宽） - 加
table-layout: fixed到.layui-table，配合min-width防滚动条闪现
关键点不在“怎么让它动起来”，而在“它什么时候才算真正准备好”。浏览器重排没完成，任何 resize 或 render 都是徒劳——这点容易被忽略，但恰恰是多数人卡住的地方。
