用Set管理多层级Tree展开节点ID，需初始化Set实例并增删ID；展开/收起父节点时递归操作所有后代；支持单节点与级联切换共存；需持久化存储ID数组并处理懒加载同步。
用 Set 管理多层级 Tree 中所有已展开节点的 ID，核心是：**统一维护一个可变的 Set 实例，在节点展开/收起时增删对应 ID，并确保父子联动逻辑清晰、无重复或遗漏**。
一、Set 初始化与基础操作
在组件或状态管理模块中初始化一个 Set：
const expandedIds = new Set();它天然去重、查找高效（O(1)），适合频繁增删和判断是否展开。
常用操作示例：
- 展开节点：expandedIds.add(nodeId)
- 收起节点：expandedIds.delete(nodeId)
- 判断是否展开：expandedIds.has(nodeId)
- 获取全部展开 ID 数组：Array.from(expandedIds)
二、处理父子展开联动（关键逻辑）
Tree 中常见需求：展开父节点时自动展开所有子节点；收起父节点时自动收起所有后代节点。Set 本身不带层级信息，需配合树结构数据完成递归操作。
假设树节点格式为：{ id, children: [...] }
实现辅助函数：
-
展开某节点及其所有后代：
function expandAllDescendants(node) {
expandedIds.add(node.id);
if (node.children) {
node.children.forEach(expandAllDescendants);
}
} -
收起某节点及其所有后代：
function collapseAllDescendants(node) {
expandedIds.delete(node.id);
if (node.children) {
node.children.forEach(collapseAllDescendants);
}
}
注意：调用前建议先通过 expandedIds.has(node.id) 判断当前状态，避免冗余操作。
三、支持单节点切换（非级联）与级联切换共存
用户可能点击节点图标触发级联展开/收起，也可能点击文字仅切换自身（不联动子节点）。可通过参数区分：
- toggleSelfOnly(node)：只操作 node.id
- toggleWithChildren(node)：调用 expandAllDescendants 或 collapseAllDescendants
UI 层根据点击区域（如箭头 vs 文本）决定调用哪个函数，Set 状态更新始终一致、无冲突。
四、同步视图与持久化注意事项
Set 是内存对象，刷新页面即丢失。如需持久化已展开状态：
- 将 Array.from(expandedIds) 存入 localStorage 或 URL query（如 ?expanded=1,3,7）
- 初始化时从存储中读取并批量写入 Set：idsArray.forEach(id => expandedIds.add(id))
- 避免直接存 Set 对象（无法序列化），只存 ID 数组
另外，若 Tree 数据动态加载（如懒加载子节点），需在新节点插入后检查其父节点是否已在 Set 中 —— 若是，应自动将其 ID 加入 Set 并触发渲染更新。
