Layui数据表格如何隐藏特定列而不影响数据读取-Layui教程-PHP中文网

hide: true是唯一不影响数据读取的可靠隐藏方式，它跳过dom渲染但保留原始数据在table.cache和事件data中，需严格匹配field、用structuredclone深拷贝并reload生效。

直接用 hide: true，别动 dom 或 css 隐藏 —— 这是唯一不影响数据读取的可靠方式。

初始化时设 `hide: true` 最稳妥

列配置里加 hide: true，Layui 渲染时跳过该列 DOM，但原始数据仍完整保留在 table.cache 和事件回调的 data 对象中。

hide 必须是布尔值 true，写成 'true'、1 或 'yes' 都无效
必须带 field，且和后端返回字段名严格一致，否则 tool 回调里 data.id 会是 undefined
如果列只是用来取 ID 做操作（比如删除按钮），建议加 unresize: true + width: 0，防止表头残留空白

示例：

table.render({
  elem: '#demo',
  cols: [[
    {field: 'id', title: 'ID', hide: true, unresize: true, width: 0},
    {field: 'username', title: '用户名'},
    {field: 'email', title: '邮箱'}
  ]]
});

动态隐藏必须走 `setCols` + `reload`

想运行时切换显隐，不能改 tableIns.config.cols 后直接用，必须深拷贝后传给 reload，否则数据上下文断裂、data 拿不到隐藏列字段。

漏掉 reload() 是最常见错误：只调 setCols 不重载，DOM 不变，data 也还是旧结构
不要用 JSON.parse(JSON.stringify()) 深拷贝 —— 会丢掉 templet 函数，改用 structuredClone（现代浏览器）或手动遍历保留函数引用
reload 时若没传 where 或 page，表格会回到第 1 页、丢失搜索条件

安全写法：

深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载

const newCols = structuredClone(tableIns.config.cols);
newCols[0].find(col => col.field === 'id').hide = true;
tableIns.reload({ cols: newCols, where: tableIns.config.where, page: { curr: tableIns.config.page.curr } });