table.exportfile() 不支持直接导出选中行,必须手动提取勾选数据;checkstatus().data 仅含当前页勾选项,跨页需自行维护 id 集合;导出前须校验数据长度、对齐表头与字段顺序,并处理 templet 渲染差异。
table.exportfile() 本身不支持「只导出选中行」,必须手动构造数据传入 —— 这是核心限制,绕不开。
为什么直接调用 table.exportFile('id') 不行
内置导出走的是当前表格的 cache(即已加载的全部页数据),不是勾选状态;即使你用了 checkbox 列并勾选了几行,exportFile() 仍会导出整页或全部分页数据(取决于是否开启 page: true 和是否传了 data)。
所以必须自己提取勾选项,再喂给 exportFile()。
如何拿到用户勾选的行数据
layui 表格的勾选状态存在 table.checkStatus(id) 返回的对象里,关键字段是 data(数组),它就是当前页面被勾选的原始数据项。
- 这个
data是浅拷贝,可直接用于导出,无需深处理 - 注意:它只包含「当前页」勾选的数据,跨页勾选需配合
id+page: false渲染或自行维护全局选中 ID 集合 - 如果表格启用了
page: true且你希望导出所有页的勾选项,得提前把每次勾选的data合并到一个数组里(比如用table.on('checkbox')监听并收集)
导出选中行的完整写法(CSV 格式)
假设你的表格实例 id 是 testTable,自定义导出按钮绑定了 click 事件:
使用 qbo-mileage CLI 及用户凭证,从 Airtable、Outlook 或 Google Calendar 记录生成 QuickBooks Online 里程 CSV 文件。
$('#exportSelected').on('click', function() {
var checkStatus = table.checkStatus('testTable');
var selectedData = checkStatus.data;
if (selectedData.length === 0) {
layer.msg('请至少勾选一行数据');
return;
}
// 构造表头:按 cols 定义顺序取 field 或 title
var cols = table.config.testTable.cols[0];
var headers = cols.map(function(col) {
return col.title || col.field;
});
// 导出
table.exportFile(headers, selectedData, 'csv');
});
注意点:
-
headers必须和selectedData每行字段顺序严格一致,否则 CSV 列错位 - 如果列用了
templet渲染(比如状态转文字),selectedData里仍是原始值(如1/0),不是渲染后的文本;需要导出前手动映射 -
exportFile()第三个参数写'csv'即可,不用加引号外的括号或对象
容易忽略的坑
最常踩的三个点:
- 误以为
checkStatus().data包含所有页勾选项 —— 实际只返回当前页,跨页要自己存 - 没校验
selectedData.length,空数组传进去会导出一个只有表头的 CSV,用户以为失败了 - 表头用
field而不是title,导致导出文件列名是user_name而不是「用户名」,可读性差
跨页导出选中项不是 exportFile 能解决的,得换思路:要么全量拉一次数据再按 ID 过滤,要么在勾选时就维护一个全局 selectedIds = new Set(),导出前查库拉对应数据。










