右侧内容区随浏览器resize自适应需分场景处理：普通div容器用height:"full-N"+节流table.resize()；Tab页需监听tab切换并延迟调resize；iframe弹层须success中监听load后调layer.iframeAuto()，跨域时try/catch降级。
右侧内容区随浏览器 resize 自适应，关键不是“监听完就调 layer.style”，而是要分清容器类型——是普通 div、tab 面板、弹层，还是内嵌 iframe。不同场景下，Layui 不会自动响应尺寸变化，必须手动补全重绘逻辑。
普通内容区（非弹层、非 iframe）
若右侧是常规 DOM 容器（如 <div class="main-content">），且内部含表格、卡片等组件：
- 给容器设
min-width: 0和overflow: hidden，尤其在 Flex 布局中，否则子元素可能因默认min-width: auto而撑宽失真 - 表格需用
height: "full-N"（如"full-120"），N 是顶部固定区域（导航栏、搜索栏等）总高，不能写死，建议用函数动态计算：height: function(){ return $(window).height() - $('#header').outerHeight() - 40; } - 绑定节流 resize：
layui.util.throttle(() => table.resize('tableId'), 150)，并在table.render()的done回调里注册，确保实例已就绪
Tab 标签页内的内容区
点击菜单新增 Tab 后，右侧 tab-item 中的内容需随窗口缩放同步调整：
- 不能只监听
window.resize，还需监听 Tab 切换事件：element.on('tab(demo)', function(data){ table.resize('tableId'); }) - Tab 内容首次加载时，DOM 可能未完全渲染，建议用
requestAnimationFrame延迟一帧再调table.resize() - 若 Tab 里有固定列（
fixed: 'left'），resize 后需手动同步行高：that.setFixedHeight()，放在done回调里执行
iframe 弹层或 Tab 中的 iframe 页面
右侧打开的是 type:2 弹层或 Tab 里嵌了 iframe，内容不随拉伸/缩放适配，是因为 iframe 标签自身 height 没更新：
- 初始化时必须显式加
iframeAuto: true，仅resize: true不生效 - 窗口缩放后，要先调
layer.style(index, {width: '90vw', height: '80vh'})，再立即补一次layer.iframeAuto(index) - iframe 加载完成前调
iframeAuto会取到 0 高度，稳妥做法是在success回调中监听 iframe 的load事件，触发后再调 - 跨域 iframe 会静默失败，加
try { layer.iframeAuto(index) } catch(e){}降级为预设尺寸，如['90vw', '70vh']
全屏或最大化状态下的适配
layer.full() 或点击最大化按钮后，浏览器缩放、横竖屏切换，弹层不会自动响应——这是 Layui 2.x 至 3.1.1 的设计限制：
- 必须手动监听
window.addEventListener('resize')，并节流调用layer.style(index, {...}) - 宽高建议用安全比例：
$(window).width() * 0.95和$(window).height() * 0.85，避开滚动条和系统 UI 占位 - iOS Safari 或微信 WebView 下，
$(window).height()常不准，可用Math.min($(window).height(), screen.height) - 100（减去状态栏、底部导航等） - 若子页面含 ECharts、Swiper 等，iframeAuto 不会触发它们的
resize()，需在子页内监听message或自定义事件来重绘
