table.checkstatus()无法获取跨页选中数据,因其仅返回当前页已勾选行;需用唯一id手动维护全局数组,并在done回调中同步lay_checked状态与dom。

不能靠 table.checkStatus() 拿跨页数据,它只返回当前页已勾选的行;必须用唯一 id 手动维护全局数组,并在 done 回调里同步 DOM 和 LAY_CHECKED 状态。
为什么 table.checkStatus() 拿不到跨页选中数据
因为 table.checkStatus('test') 返回的 data 字段只包含当前页渲染后被用户勾选的行,不感知历史操作。Layui 表格每次翻页都会销毁旧 DOM、重载 res.data,内部缓存不跨页延续——这不是 bug,是设计如此。常见错误是:监听 checkbox 事件后直接把 obj.data 推进数组,结果翻页后 obj.data 里的字段(比如 index 或临时 lay-id)全部重排,ID 映射错乱。
如何用 id 维护全局选中状态
核心是定义一个稳定标识 + 全局数组 + 事件响应逻辑:
- 后端返回的数据必须含唯一字段(如
id、user_id),并在table.render()中显式声明:id: 'user_id'(注意:这是 render 参数,不是列定义里的field) - 全局定义:
let selectedIds = []; - 监听
table.on('checkbox(test)', ...),根据obj.type区分行为:- 单选(
obj.type === 'one'):勾选时selectedIds.push(obj.data.id),取消时selectedIds = selectedIds.filter(id => id !== obj.data.id) - 全选(
obj.type === 'all'):只处理当前页,用obj.data.map(d => d.id)批量增删,别试图塞入全部 ID(数据未全加载)
- 单选(
翻页后怎么恢复 checkbox 视觉状态
done 是唯一可靠的时机——此时 DOM 已渲染完毕,setRowChecked 或手动操作才能生效。早于它(如 parseData)会失败;晚于它(如 setTimeout)可能被后续渲染覆盖:
- 遍历
res.data,对每个row.id(确认字段名,可能是row.userId)检查是否在selectedIds中 - 若存在,设
row.LAY_CHECKED = 'true'(Layui 内部识别该字段) - 同时执行 DOM 同步:
$('input[type="checkbox"]').prop('checked', true).next().addClass('layui-form-checked')(需加选择器限定范围,否则影响所有表格) - 表头全选框也要手动同步:
$('.layui-table th[data-field="0"] input')的checked属性和类名
table.reload() 时勾选状态丢失的修复
reload 不继承初始配置,漏传任意一项(url、where、page)都可能导致跳页或空渲染,从而清空 DOM 状态:
- 必须显式传全:
table.reload('test', { url: '/api/list', where: { token: localStorage.getItem('token') }, page: { curr: tableIns.config.page.curr } }) -
where中的动态值(如 token、搜索关键词)每次都要重新读取,不能写死 - 如果用了定时刷新,务必在
done中校验res.data和res.code,防止接口异常时用空数据重绘表格,导致选中状态“静默归零”
最容易被忽略的是:LAY_CHECKED 字段和 DOM checked 状态必须**同时设置**,缺一不可;且唯一标识必须来自后端真实主键,任何依赖索引、临时生成或前端计算的 key 都会在翻页后失效。











