layui table 导出时需通过 exportfile 的 cols 参数手动指定导出列,排除操作列;若用多级表头,cols 必须保持相同嵌套结构,否则导出错位;优先推荐 cols 方案而非修改数据。

layui table 导出时如何隐藏操作列
layui 的 table.exportFile() 默认会把所有列(包括模板列)原样导出,操作按钮那列的文字(比如“编辑”“删除”)也会出现在 Excel 里。这不是 bug,是它按 DOM 渲染结果导出的默认行为——你得主动告诉它哪些列不参与导出。
用 cols 参数手动指定导出列
导出方法支持传入 cols 配置项,它是一个二维数组,结构和 table.render() 的 cols 一致,但只写你想导出的列。关键点:**不写操作列,它就不会出现**。
常见做法:
- 复制你渲染表格时的
cols配置,删掉操作列那一项(通常是最后一列) - 确保每层
cols数组都对齐,比如主表头有 3 列,cols里也得是长度为 3 的数组 - 如果用了多级表头(
title嵌套),cols必须保持相同层级结构,否则导出错位
示例(假设原始表格有「姓名」「年龄」「操作」三列):
table.exportFile('idTest', data, {
cols: [[
{field: 'name', title: '姓名'},
{field: 'age', title: '年龄'}
]]
});
操作列用 templet 但字段本身为空怎么办
有些同学把操作列的 field 设为空字符串或 null,再靠 templet 渲染按钮,以为这样导出就自然没内容。但 exportFile 仍会导出空字符串或 undefined,Excel 里变成空白格甚至 undefined 文字。
更稳妥的方式:
- 给操作列设一个真实但无意义的
field(如op),并在数据中统一赋值为null或空字符串 - 导出时通过
cols完全剔除该列,而不是依赖字段值为空 - 避免用
templet返回纯 HTML 标签(如<button>编辑</button>),因为导出时会提取全部文本,可能带出“编辑”二字
用 done 回调临时修改数据再导出
如果列结构动态、不好预设 cols,也可以走数据层过滤:在 table.render() 的 done 回调里,把原始数据深拷贝一份,删掉操作字段后再调用 exportFile。
注意点:
- 必须深拷贝(
JSON.parse(JSON.stringify(data))或用layui.$.extend(true, {}, data)),否则改的是原表格数据 - 删字段要用
delete row.op或row['op'] = undefined,不能只设为空字符串 - 这种方法比
cols略重,尤其数据量大时有性能损耗,优先推荐cols方案
真正麻烦的不是怎么删,而是容易忽略 cols 支持嵌套结构这个细节——多级表头下漏写一层,导出就全乱了。动手前先 console.log 一下你表格的 config.cols,照着抄,改完立刻试一次导出。











