Layui table.checkStatus仅返回当前页已勾选行,未勾选行需手动比对:先从table.cache或done回调获取当前页数据,再用checkStatus结果排除已选项。

layui table 如何用 checkStatus 获取当前页未勾选行
直接结论:Layui 的 table.checkStatus 只返回「已勾选」的行数据,不提供“未勾选”集合;必须手动比对当前页所有数据与已勾选 ID(或索引)才能得到未勾选行。别指望它内置反向筛选。
为什么不能只靠 table.checkStatus?
这个方法本质是读取 DOM 中 checkbox 的勾选状态,再映射回 data 数组里的对应项 —— 但它只收集勾选项,不会遍历全量数据。如果你表格开启了分页,checkStatus 返回的 data 仅限当前页已勾选的行,且不包含未勾选的任何信息。
常见误操作:
- 调用
table.checkStatus('id')后直接对返回的data做filter取反 → 结果为空数组(因为没原始全量) - 试图用
table.cache拿全量数据但忽略分页偏移 → 拿到的是全部缓存数据(含其他页),不是当前页
正确做法:结合 table.cache、table.config 和当前页码计算当前页数据范围
核心思路:从 table.cache 中取出当前表格的完整缓存数据,再根据当前页码、每页条数、起始索引,截出「当前页实际渲染的数据子集」,最后用勾选项的 lay-id 或业务主键做排除。
实操步骤:
- 通过
table.get('id')或全局table.config['id']获取表格配置,拿到page(当前页)、limit(每页数) - 从
table.cache['id']获取全量缓存数组,注意:这是初始化时加载的全部数据(不分页),若用服务端分页则此处为空,需换方案 - 计算当前页数据起始索引:
const start = (page - 1) * limit,截取:const currentPageData = cache.slice(start, start + limit) - 用
table.checkStatus('id').data获取当前页已勾选行,提取其唯一标识(推荐用lay-id,若没设则 fallback 到id字段) - 过滤:
currentPageData.filter(row => !checkedIds.has(row['lay-id'] || row.id))
示例片段(假设表格 id 为 userTable,主键字段为 id):
const ins = table.get('userTable');
const config = table.config.userTable;
const cache = table.cache.userTable || [];
const page = config.page.curr || 1;
const limit = config.page.limit || 10;
const start = (page - 1) * limit;
const currentPageData = cache.slice(start, start + limit);
const checked = table.checkStatus('userTable').data;
const checkedIds = new Set(checked.map(item => item.id));
const unchecked = currentPageData.filter(row => !checkedIds.has(row.id));
console.log('当前页未勾选行:', unchecked);
服务端分页下怎么处理?
如果表格用的是 url + page 模式(即服务端分页),table.cache 是空的,无法靠它取当前页数据。此时必须自己维护一份当前页原始数据副本:
- 在
done回调里把res.data存到闭包变量或组件 data 中,例如currentRawPageData = res.data - 勾选状态变化时(监听
checkbox事件或onCheck),始终基于这份副本做比对 - 切页后重新赋值
currentRawPageData,否则会拿错页数据
漏掉这一步,就等于拿不到“当前页有哪些行”,一切排除逻辑都失去依据。
最易被忽略的点:服务端分页场景下,没人帮你记着当前页原始数据 —— 这个责任完全落在开发者手上,而且必须和分页动作严格同步。缓存错一页,未勾选结果就全偏了。


















