Layui树组件默认选中需节点含唯一id且checked为布尔true;父节点选中会级联子节点;动态控制用tree.setChecked();无id或未设LAY_CHECKED会导致选中失效。

默认选中必须在数据里写 checked: true,且每个节点要有唯一 id;父节点设 checked: true 会连带勾选全部子节点,这不是 bug,是 Layui 的默认行为。
data 中直接设置 checked: true 最常用也最可靠
只要节点有 id 字段,且值为布尔 true,Layui 渲染时就会自动打钩。注意以下几点:
-
checked必须是布尔值,不能是字符串"true"或数字1 - 后端返回字段名如果是
is_checked或selected,前端得先映射:用customName: { checked: 'is_checked' } - 如果节点没有
id,tree.setChecked()会失效,父子联动也会错乱 - 叶子节点设
checked: true安全;父节点设了,所有子节点都会被初始化为勾选状态
用 tree.setChecked() 动态控制更灵活
适合需要按权限 ID 列表匹配、或只勾选部分子节点的场景,能绕过父节点自动展开/勾选子节点的问题:
- 必须在
tree.render()之后调用,且id参数要和渲染时传入的id严格一致,否则报错"Cannot read properties of undefined (reading 'getChecked')" - 示例:
tree.setChecked('treeDemo', [101, 102])—— 只勾选 ID 为 101 和 102 的节点,不管它们是不是父节点 - 传空数组
[]可清空所有勾选,适合重置操作 - 该方法不触发
oncheck回调,如需通知业务逻辑,得手动补发
为什么写了 checked: true 却没生效?查 LAY_CHECKED
某些旧版 Layui 或封装过的 treetable 组件,会忽略原始 checked 字段,转而依赖内部标记 LAY_CHECKED:
-
LAY_CHECKED是字符串类型,值只能是'true'或'false',不是布尔值 - 解决办法:在
tree.render()前,对数据做一次预处理:node.LAY_CHECKED = node.checked ? 'true' : 'false' - 标准
tree模块通常不需要这个字段,但如果用了自定义组件或 treetable,就得加
想让父节点“一打开就显示半选图标”,不能设 indeterminate
Layui tree 不支持初始化时设半选状态,因为 indeterminate 是渲染后动态计算出的视觉表现,不是可存的数据状态:
- 写
indeterminate: true或checked: true在父节点上,都不会触发半选图标 - 唯一办法:确保该父节点有
children数组(不能是null或[]),且其中部分子节点带checked: true,部分不带或明确checked: false - 懒加载(
isLazy: true)场景下,初始子节点为空,父节点无法半选;等子节点加载完后,需手动调用tree.setChecked()补充勾选
最容易被忽略的是 id 字段的强制要求和 LAY_CHECKED 的兼容性问题——没 id 的树,后续所有 API 都可能静默失败;而用了定制组件却没补 LAY_CHECKED,默认选中就永远不生效。


















