序号列无法通过 hide: true 隐藏,因其是 layui 表格内置伪列,不参与 cols 配置;正确做法是初始化时不设 type: 'numbers',或用 templet 手动渲染序号。
序号列不是普通列,不能直接设 hide: true
layui 的序号列(type: 'numbers')是表格内置的“伪列”,它不对应真实数据字段,也不在 cols 数组里声明为一个独立对象。所以你给它加 hide: true 会无效 —— 它压根没出现在 cols[0] 里,根本找不到地方写。
- 常见错误:在
cols里硬加一个{ type: 'numbers', hide: true }—— layui 不认这个写法,控制台可能报错或静默忽略 - 正确做法:序号列只在初始化时通过
cols中某列的type: 'numbers'开启,它没有field,也不参与setCols动态更新 - 如果你用的是
table.render()且没手动配type: 'numbers',但表格顶部还是出现了序号列,那大概率是开启了defaultToolbar的“排序”或“筛选”功能,触发了内部渲染逻辑,需检查是否误启了自动序号
隐藏序号列的两种可靠方式
要么不让它出现,要么导出/打印前临时剥离 —— 没有“运行时 toggle”的 API。
-
初始化时就不配:彻底不写
type: 'numbers'。这是最干净的做法。如果只是想让行有视觉编号,改用templet在第一列手动渲染:{ field: 'id', title: '序号', templet: '{{ d.LAY_TABLE_INDEX + 1 }}' } -
导出时过滤掉:序号列在
table.cache里不存在对应字段,但导出 CSV/Excel 时若用了自定义exportFile,要主动跳过type === 'numbers'的列:if (col.type === 'numbers') return;,否则导出文件里会出现空或重复序号 - 别用 CSS 隐藏:
$("[data-field='LAY_TABLE_INDEX']").hide()看似可行,但表头和 tbody 列数会错位,横向滚动时对不齐,且打印预览仍显示
为什么 table.hideCol('LAY_TABLE_INDEX') 不起作用
因为 hideCol 是针对有 field 的列设计的,而序号列的 DOM 属性是 data-field="LAY_TABLE_INDEX",但它不是配置项里的合法 field,内部查不到匹配列,调用后无反应,也不报错。
- 调试时可验证:
console.log(tableIns.config.cols[0])—— 你会发现数组里根本没有field: 'LAY_TABLE_INDEX'这一项 - 有人尝试
setCols后reload,但序号列不受cols数组变更影响,reload 只重绘已声明的列 - 唯一能“动态干预”的时机是
done回调,但此时 DOM 已渲染完成,CSS 隐藏会留下布局缝隙,且无法修复表头宽度计算问题
templet 控制更可控;不需要时,从源头去掉 type: 'numbers' 最省心。


















