layui.tree/treetable 复选框联动应使用原生机制：tree 启用 showcheckbox: true 即可自动处理父子全选/半选；treetable 需设 cascade: 'none' 后手动调用 checknode；务必统一字段名（customname）、children 结构及 checked 布尔类型。

直接用 layui.tree 或 layui.treetable 的原生联动机制，别手动监听 form.on('checkbox()') 去操作 dom 类名——那套写法早过时了，兼容性差、半选状态丢失、父子逻辑错乱，修起来比重写还费劲。

tree.render 启用复选框联动只需两步

layui 2.7+ 的 tree 组件已内置完整父子联动逻辑，不需要自己遍历兄弟元素或加减 layui-form-checked 类。

• showCheckbox: true 是开关，必须显式开启
• 数据结构里用 children 嵌套，层级关系自动识别
• 父节点选中 → 所有子节点自动勾选；子节点部分取消 → 父节点自动变半选（layui-tree-checkboxIndeterminate 类）；子节点全取消 → 父节点自动取消
• 默认就支持三级以上嵌套，无需额外配置

treeTable 中关闭默认联动后手动控制

如果用的是 treeTable 且需要自定义联动逻辑（比如只联动直属子级、跳过某些节点），得先关掉默认行为，再用 API 手动处理。

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

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

下载

• 初始化时设置 tree: { data: { cascade: 'none' } }
• 在 oncheck 回调里用 treeTable.checkNode(id, checked, { cascade: 'children' }) 控制子级
• 查当前状态要用 treeTable.checkStatus(id, true)，第二个参数 true 表示包含半选节点
• 注意：checkNode 不会自动反向更新父级，需自己递归计算并调用 checkNode(parentId, ...)

常见坑：自定义字段名导致联动失效

如果你的数据 key 不是默认的 id/title/children，联动会静默失败——树组件压根找不到子节点在哪。

• 必须配 customName 映射字段：customName: { id: 'value', title: 'label', children: 'items' }
• customName.id 必须唯一且稳定，不能是动态生成的随机字符串
• children 字段值为 null 或 undefined 时，该节点会被当作叶子节点，不触发任何联动
• 数据里混用 checked: true 和 checked: 'true'（字符串）会导致初始状态异常

真正难的不是写联动逻辑，而是确保数据结构干净、字段映射准确、初始 checked 值类型统一。一旦这三样出问题，后面所有 JS 补丁都是在给黑洞打补丁。