Layui表格运行时状态(如列宽、排序、分页等)不存于layui.table.config或table.cache中,需通过监听sort/page事件手动维护状态对象,并结合DOM查询列宽、显隐及顺序。
layui.table.config 里存的是初始化配置,不是渲染后的全量参数
直接读 layui.table.config 拿不到列宽、排序状态、分页位置这些运行时变更的值——它只保存你调用 table.render() 时传入的原始配置。真正“已渲染成功”的全量参数,得从表格实例本身取。
用 table.cache[id] + table.getCheckData(id) + 实例属性组合还原
渲染完成后,Layui 会把关键动态数据挂到几个地方:
-
table.cache['your-table-id']:含当前页所有行的原始数据(包括被隐藏/过滤掉但仍在缓存里的),不含列配置或 UI 状态 -
table.getCheckData('your-table-id'):仅返回当前页被勾选的行数据 - 表格实例(
table.render()返回值)的config属性:是原始配置的浅拷贝,不包含后续调用table.sort()或table.resize()改变的状态 - 真正要拿列宽、排序字段、当前页码、每页条数,得查 DOM 或监听事件后手动维护
监听 table.on('sort') 和 table.on('page') 才能捕获实时状态
列排序、分页切换这类操作不会自动更新某个全局对象,必须自己记:
table.on('sort(test)', function(obj){
// obj.field 是排序字段,obj.type 是 asc/desc
// 你需要自己存到一个变量里,比如:
window.testTableState = {
sortField: obj.field,
sortOrder: obj.type,
page: table.cache['test'] ? (table.cache['test'].curr || 1) : 1,
limit: table.cache['test'] ? (table.cache['test'].limit || 30) : 30
};
});
注意:table.cache['xxx'] 在分页后才更新,所以 curr 和 limit 要在 page 事件里再同步一次。
列宽和列显隐状态只能靠 DOM 查询 + 手动映射
Layui 不提供 API 直接读列宽或是否隐藏,得自己扒:
- 列宽:遍历
$('.layui-table-box .layui-table-header th'),读$(th).width(),再按data-field属性匹配到对应列 - 列显隐:查
th是否有layui-hide类,或看$(th).css('display') === 'none' - 列顺序:依赖
th的 DOM 顺序,和cols[0]数组顺序可能不一致(如果拖拽过列)
拖拽列序后,cols[0] 不会变,但 DOM 顺序变了——这意味着你不能只靠配置数组还原 UI 状态。
最稳妥的方式是把关键状态(排序、分页、列宽、显隐、顺序)在每次交互后存进一个本地对象,而不是试图从某个单一入口“获取全量”。Layui 的设计没把运行时状态全暴露出来,得自己补这一环。











