应将摘要区置于表格容器外部并用 css 定位，避免被重载影响；row 事件中需通过 obj.tr.data('index') 查 table.cache 获取准确数据，防止重复绑定与视觉错位。
直接用 row 事件 + 手动更新底部 dom 即可，不需要 reload 或重绘整表，但必须防重复绑定和数据错位。
为什么不能只靠 row 事件回调里直接写 $('#summary').text(...)
因为 row 事件在表格重载、分页、搜索后会重新触发多次，若没清理旧监听，会导致同一个点击触发多轮更新；另外，obj.data 是原始数据，但用户看到的行可能已被排序或过滤，直接取它容易和视觉位置对不上。
- 每次调用
table.render()都会注册新row监听，老监听还在，点一次执行 N 次 -
obj.data不含 Layui 自动加的临时字段（如LAY_TABLE_INDEX），但摘要常需显示序号或状态标签，得靠obj.tr.data('index')去查缓存 - 如果表格开了
height，tbody 滚动时row事件仍会触发——不是用户“点击”，而是滚动复用导致的误触发
row 事件里怎么安全取到当前点击行的摘要字段
别依赖 obj.data 直接拼字符串，要结合缓存索引和字段映射。先确保初始化表格时每行有稳定标识（比如 id 或 user_id），再从 table.cache 中捞出完整上下文。
- 用
obj.tr.data('index')拿到渲染序号，再查table.cache['test'][index]，比直接用obj.data更可靠 - 摘要区域常用字段如：
name、status、created_at，建议统一转成中文键名，避免模板里写data.user_name这种易错写法 - 如果摘要要带状态色块（如“启用”绿色、“禁用”红色），别在 JS 里拼 HTML 字符串，改用 CSS 类控制：
class="status-{{status}}"
示例：
table.on('row(test)', function(obj){
var index = obj.tr.data('index');
var cacheData = table.cache['test'][index];
var summary = `【${cacheData.name}】${cacheData.status === '1' ? '✅ 启用' : '❌ 禁用'}｜${cacheData.created_at}`;
$('#summary').text(summary);
});
底部摘要区域 DOM 怎么保持不被表格重载影响
摘要区必须脱离表格容器，否则 table.reload() 或分页切换时整个 tbody 被替换，连带把摘要 DOM 一起干掉。最稳妥是把它放在表格父容器外部，用绝对定位或 flex 布局固定到底部。
- 不要把
<div id="summary"></div>放在<table class="layui-hide"></table>内部或紧邻下方（渲染后会被table.render()的插入逻辑覆盖） - 推荐结构：
<div class="table-wrapper"><table></table></div> <div id="summary"></div>，然后用 CSS 控制#summary的margin-top或position: sticky - 如果表格用了
height，摘要区要设z-index并加background: #fff，否则滚动时文字被 tbody 内容遮挡
真正难的是跨页状态同步——用户点了第 3 页某行，摘要显示了；切到第 1 页再点，摘要却还是第 3 页那条。这说明你没清掉上一次的 row 监听，或者没在 done 回调里重置摘要内容。这种问题不会报错，只会让用户觉得“有时候准、有时候不准”。
