Layui table.render()不支持真正多级表头，仅靠二维cols数组+colspan模拟两级表头；rowspan无效，fixed列必须置于首行，reload不更新表头需destroy后重render，复杂场景应在done回调中手动重写thead并保留data-field属性。
layui 的 table.render() 原生不支持真正意义上的多级表头，所谓“两级”只是靠 cols 二维数组 + colspan 模拟出来的视觉效果，rowspan 在绝大多数版本中完全无效。
cols 必须是严格二维数组，且行间列数要对齐
Layui 只认两层结构：cols: [ [第一行], [第二行] ]。任何三维、children 或扁平写法都会被忽略或降级为单级表头。
- 第一行用于顶层标题，靠
colspan合并列（如{title: '用户', colspan: 2}） - 第二行必须是具体字段列，个数必须等于第一行所有
colspan值之和（比如colspan: 2 + colspan: 3 = 5，那第二行就得刚好 5 个对象） - 第二行每个列都必须有
field（哪怕只是占位），否则报Cannot read property 'field' of undefined - 第二行不能写
colspan或rowspan，写了也不解析，还可能导致后续列丢失
fixed 列必须放在第一行对应位置
如果你用了 fixed: 'left'，它必须出现在第一行的某个列配置里，而不是第二行。否则排序图标错位、点击无响应——因为 Layui 的固定列锚点只基于首行 DOM 结构计算。
- 错误写法：
cols: [[{title:'用户'}], [{field:'name', fixed:'left'}]]→ 固定失效 - 正确写法：
cols: [[{title:'用户', fixed:'left'}, {title:'订单'}], [{field:'name'}, {field:'id'}]] - 如果固定列属于子列（如“用户 > 姓名”），只能把
fixed写在第一行对应合并列上，第二行字段列不参与 fixed 定位
表头更新不能靠 reload，得 destroy 后重 render
table.reload() 不会重建表头 DOM，改了 cols 数组再 reload，界面毫无反应。
- 唯一可靠方式是先调
table.destroy('myTable')，再完整执行一次table.render() - 销毁前务必手动保存当前页码、排序字段、筛选条件等状态，否则重绘后回到第 1 页且全部清空
- Vue/React 响应式绑定
cols也无效，Layui 不监听数组变更
复杂场景直接在 done 回调里重写 thead
当需要三级以上表头、自定义样式、IE11 兼容或带 toolbar 时，二维 cols 已经力不从心，最稳的做法是放弃原生渲染，在 done 回调里用 jQuery 替换 <thead>。
- 先让 layui 渲染出默认单级表头，拿到
$('table[lay-id="myTable"] thead') - 构造新 HTML，关键要保留所有
data-field和data-key属性（排序/导出全靠它） - 示例：
<tr><th colspan="2">用户</th><th colspan="2">订单</th></tr><tr><th data-field="name">姓名</th><th data-field="age">年龄</th><th data-field="id">ID</th><th data-field="amount">金额</th></tr> - 执行
$thead.html(newHtml)后，立刻调table.resize('myTable')，否则滚动时列宽错位
最容易被忽略的是：所有叶子列（即最终绑定数据的列）必须显式设 width，minWidth 不足以约束多级表头下的列宽；另外，导出 Excel 时 colspan 完全不生效，需用 SheetJS 手动构建 !merges 区域。
