SepTree 树形控件 v1.0.0
展开/折叠 · 单选 · 复选框多选（父子联动 + 半选） · 搜索过滤 + 高亮 · 禁用节点 · 自定义渲染 · TreeSelect 下拉树
1. 基础树形（展开/折叠 + 单选）
功能说明：点击展开箭头折叠/展开子节点（箭头有 0.2s 旋转动画）；点击节点标题选中该节点并高亮；defaultExpandAll 默认展开全部节点；size 控制节点尺寸（small/middle/large）；showLine 显示树形连接线（含 ├ └ 连接器和祖先竖线）。键盘支持 ↑↓ 导航、← 折叠、→ 展开、Enter 选中。
2. 复选框多选（父子联动 + 半选）
3. 搜索过滤 + 高亮
4. 禁用节点
5. 自定义节点渲染（titleRender / icon）
6. API 动态操作
7. SepTreeSelect 下拉树选择
8. 增强功能（拖拽排序 + 虚拟滚动 + blockNode + filterTreeNode + loadData）
功能说明：draggable 开启节点拖拽排序，drop 时通过 onDrop 回调交付排序结果；virtual 开启虚拟滚动，仅渲染可视区节点，适合超大数据量（如 500+ 条）；blockNode 整行响应选中点击；filterTreeNode 自定义搜索匹配逻辑；loadData 支持异步懒加载子节点。
8b. 第三批增强（autoExpandParent / emptyText / searchPlaceholder / searchField / showIcon / indent）
功能说明：autoExpandParent 设置 checkedKeys/selectedKeys 时自动展开父节点链；emptyText 自定义空数据提示文本；searchPlaceholder 自定义搜索框占位符；searchField 指定搜索匹配的字段；showIcon 控制是否显示节点图标；indent 自定义每层缩进像素值。
9. TreeSelect 增强（maxTagCount + showCheckedStrategy）
功能说明：maxTagCount 限制多选标签展示数量，超出折叠为 +N 提示（支持 maxTagPlaceholder 自定义折叠内容）；showCheckedStrategy 控制多选时选中值的展示策略 —— SHOW_ALL 显示全部 / SHOW_PARENT 只显示最高层级父节点 / SHOW_CHILD 只显示末级子节点（无子节点被选中的）。
10. TreeSelect 进阶（labelInValue + 自定义下拉样式 + treeNodeLabelProp）
功能说明：labelInValue 使 getValue/setValue 返回 {value, label} 结构，便于同时获取键值与显示文本；dropdownStyle / dropdownClassName 自定义下拉面板内联样式与类名（下方示例面板为 360px 宽 + 主题色边框）；treeNodeLabelProp 指定用于显示标签的节点字段（替代默认 titleField）。
10.5 体验增强（selectable + expandOnCheckNode + checkOnClickLeafOnly + bordered + showArrow + maxTagTextLength）
功能说明：selectable:false 禁用节点选中（仍可展开/勾选）；expandOnCheckNode 勾选节点时自动展开；props 统一配置字段映射；bordered 控制边框；showArrow 控制箭头；maxTagTextLength 标签文本截断；listHeight 下拉面板高度；checkOnClickNode 点标题勾选；checkOnClickLeafOnly 仅叶子节点点标题勾选（父节点只展开不勾选）。
10.6 事件回调与容器挂载（onSearch + onClear + getPopupContainer）
功能说明：onSearch 搜索关键词变化时回调；onClear 清除选择时回调；getPopupContainer 指定下拉面板挂载容器（解决被父级 overflow 裁剪的问题）；同时支持 别名：nodeKey（keyField）、treeData（data）、defaultExpandParent（autoExpandParent）、filterNodeMethod（filterTreeNode）。
11. 自动化断言
12. 完整功能说明（配置项 / API / 事件）
12.1 Tree 配置项
| 配置项 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| data | Array | [] | 树节点数据，结构由 keyField/titleField/childrenField 定义 |
| keyField | String | 'id' | 节点唯一标识字段名 |
| titleField | String | 'title' | 节点标题字段名 |
| childrenField | String | 'children' | 子节点数组字段名 |
| props | Object | null | 统一字段映射：{label, children, disabled} |
| dataMode | String | 'tree' | 数据格式：'tree' 嵌套结构 / 'flat' 扁平结构（配合 parentField） |
| parentField | String | 'parentId' | 扁平数据中父节点字段名 |
| defaultExpandAll | Boolean | false | 是否默认展开全部节点 |
| defaultExpandLevel | Number | 0 | 默认展开的层级数，0 表示不按层级展开 |
| expandedKeys | Array | [] | 默认展开的节点 key 数组 |
| checkedKeys | Array | [] | 默认勾选的节点 key 数组（checkable=true 时生效） |
| selectedKey | Any | null | 默认选中的节点 key（单选模式） |
| selectedKeys | Array | [] | 默认选中的节点 key 数组（多选模式） |
| checkable | Boolean | false | 是否显示复选框 |
| checkStrictly | Boolean | false | 是否父子不联动（严格勾选模式） |
| checkOnClickNode | Boolean | false | 是否点击节点标题时勾选/取消复选框 |
| checkOnClickLeafOnly | Boolean | false | checkOnClickNode 为 true 时，是否仅叶子节点生效（父节点不勾选） |
| multiple | Boolean | false | 是否允许多选 |
| selectable | Boolean | true | 是否允许选中节点（false 时仍可展开/勾选） |
| expandOnClickNode | Boolean | true | 是否点击节点时展开/折叠 |
| expandOnCheckNode | Boolean | false | 是否勾选节点时自动展开其子节点 |
| accordion | Boolean | false | 是否手风琴模式（同级只展开一个） |
| highlightCurrent | Boolean | true | 是否高亮当前选中节点 |
| showCheckedStrategy | String | 'SHOW_ALL' | 勾选结果返回策略：SHOW_ALL 全部 / SHOW_PARENT 只父节点 / SHOW_CHILD 只子节点 |
| showLine | Boolean | false | 是否显示树形连接线 |
| icon | String|Function | null | 全局节点图标（FontAwesome 类名或返回类名的函数） |
| showIcon | Boolean | true | 是否显示节点图标 |
| switcherIcon | Object | null | 自定义展开箭头 { open, close } |
| titleRender | Function | null | 自定义节点标题渲染函数 (node) => HTML |
| tooltip | Boolean | true | 是否显示原生 title 提示 |
| searchable | Boolean | false | 是否显示搜索框 |
| searchDebounce | Number | 200 | 搜索防抖毫秒数 |
| searchField | String | '' | 搜索匹配的字段名，默认使用 titleField |
| searchPlaceholder | String | '' | 搜索框占位符 |
| onSearch | Function | null | 搜索关键词变化时回调 (keyword) => void |
| renderAfterExpand | Boolean | false | 是否仅渲染已展开节点的子节点（性能优化） |
| filterTreeNode | Function | null | 自定义节点过滤函数 (node, keyword) => Boolean |
| emptyText | String | '' | 空数据提示文本 |
| indent | Number | 0 | 每层缩进像素值（0 使用默认 24px） |
| autoExpandParent | Boolean | true | 设置 checkedKeys/selectedKeys 时是否自动展开父节点链 |
| draggable | Boolean | false | 是否允许拖拽节点 |
| allowDrag | Function | null | 判断节点是否可拖拽 (node) => Boolean |
| allowDrop | Function | null | 判断是否允许放置 (dragNode, dropNode, type) => Boolean |
| loadData | Function | null | 异步加载子节点数据 (node) => Promise 或 回调 |
| blockNode | Boolean | true | 是否整行可点击（false 时仅标题可点） |
| virtual | Boolean | false | 是否启用虚拟滚动（大数据量优化） |
| height | Number | 0 | 虚拟滚动容器高度 |
| size | String | 'middle' | 尺寸：'small' / 'middle' / 'large' |
| disabled | Boolean | false | 是否禁用整个树 |
12.2 Tree API 方法
| 方法 | 参数 | 返回 | 说明 |
|---|---|---|---|
| getData() | - | Array | 获取当前树数据 |
| setData(data) | data: Array | void | 重新设置树数据 |
| getNode(key) | key | Node|null | 根据 key 获取节点对象 |
| getExpandedKeys() | - | Array | 获取所有展开节点的 key |
| expand(key) | key | void | 展开指定节点 |
| collapse(key) | key | void | 折叠指定节点 |
| expandAll() | - | void | 展开全部节点 |
| collapseAll() | - | void | 折叠全部节点 |
| getCheckedKeys() | - | Array | 获取所有勾选节点的 key（按 showCheckedStrategy） |
| getHalfCheckedKeys() | - | Array | 获取半选状态节点的 key |
| setCheckedKeys(keys) | keys: Array | void | 设置勾选的节点 key |
| check(key) | key | void | 勾选指定节点 |
| uncheck(key) | key | void | 取消勾选指定节点 |
| checkAll() | - | void | 全选所有可勾选节点 |
| uncheckAll() | - | void | 取消所有勾选 |
| getSelectedKey() | - | Any | 获取单选模式选中的 key |
| getSelectedKeys() | - | Array | 获取多选模式选中的 key 数组 |
| setSelectedKeys(keys) | keys: Array | void | 设置选中的节点 key |
| search(keyword) | keyword: String | void | 搜索过滤节点并高亮匹配项 |
| append(data, parentKey) | data, parentKey? | Node | 追加子节点（parentKey 为空则追加到根） |
| insertBefore(data, refKey) | data, refKey | Node | 在 refKey 节点前插入 |
| insertAfter(data, refKey) | data, refKey | Node | 在 refKey 节点后插入 |
| remove(key) | key | Boolean | 删除指定节点 |
| update(key, data) | key, data | Node | 更新指定节点的数据 |
| setLoading(key, loading) | key, loading: Boolean | Boolean | 设置节点加载状态 |
| scrollTo(key) | key | Boolean | 滚动到指定节点（自动展开父链） |
| destroy() | - | void | 销毁实例并清理事件 |
12.3 Tree 事件回调
| 事件 | 回调参数 | 说明 |
|---|---|---|
| onChange | value | 选中或勾选变化时触发（单选传 key，多选传 keys） |
| onSelect | key, { selected, node } | 节点选中状态变化时触发 |
| onCheck | keys, { checked, node } | 节点勾选状态变化时触发 |
| onExpand | keys, { expanded, node } | 节点展开/折叠时触发 |
| onNodeClick | key, { node, event } | 点击节点标题时触发 |
| onContextMenu | e, { key, node } | 节点右键点击时触发 |
| onDragStart | node, e | 开始拖拽节点时触发 |
| onDragEnd | node, e | 结束拖拽时触发 |
| onDrop | { dragNode, dropNode, dropType, event } | 放置节点时触发，dropType: 'before'|'after'|'inner' |
12.4 节点级自定义属性
| 属性 | 类型 | 说明 |
|---|---|---|
| icon | String|Function | 节点图标，优先级高于全局 icon |
| className | String | 节点附加 CSS 类名 |
| style | Object | 节点行内样式 |
| disabled | Boolean | 禁用该节点（不可选、不可拖拽） |
| disableCheckbox | Boolean | 禁用该节点的复选框（仍可展开折叠） |
| isLeaf | Boolean | 是否叶子节点（影响展开箭头和异步加载） |
12.5 TreeSelect 特有配置
| 配置项 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| value | Any|Array | null | 选中值（单选为 key，多选为 keys 数组） |
| multiple | Boolean | false | 是否多选 |
| treeCheckable | Boolean | false | 是否显示复选框（多选时自动 true） |
| treeCheckStrictly | Boolean | false | 树复选框父子是否联动 |
| treeDefaultExpandAll | Boolean | false | 树是否默认展开全部 |
| treeExpandedKeys | Array | null | 树默认展开的节点 key |
| onTreeExpand | Function | null | 树节点展开时回调 |
| onSearch | Function | null | 搜索关键词变化时回调 (keyword) => void |
| onClear | Function | null | 点击清除按钮时回调 |
| allowClear | Boolean | true | 是否显示清除按钮 |
| maxTagCount | Number | 0 | 多选标签最大显示数（0 不限制） |
| maxTagPlaceholder | String|Function | null | 标签溢出时的占位内容 |
| maxTagTextLength | Number | 0 | 标签文本最大字符数（超出截断为…） |
| showCheckedStrategy | String | 'SHOW_ALL' | 多选展示策略：SHOW_ALL / SHOW_PARENT / SHOW_CHILD |
| labelInValue | Boolean | false | getValue/setValue 是否返回 {value, label} 结构 |
| treeNodeLabelProp | String | '' | 指定显示标签的节点字段（默认取 titleField） |
| treeNodeFilterProp | String | '' | 搜索匹配的节点字段（，默认取 titleField） |
| treeDataSimpleMode | Boolean | false | 是否使用扁平数据模式（，等价于 dataMode:'flat'） |
| treeData | Array | [] | 树数据（别名，等价于 data） |
| data | Array | [] | 树节点数据 |
| bordered | Boolean | true | 是否显示边框 |
| showArrow | Boolean | true | 是否显示下拉箭头 |
| listHeight | Number | 256 | 下拉面板最大高度（px） |
| notFoundContent | String | '' | 空数据时下拉面板的提示内容 |
| dropdownMatchSelectWidth | Boolean | true | 下拉面板宽度是否匹配触发器宽度 |
| dropdownStyle | Object | null | 下拉面板自定义内联样式 |
| dropdownClassName | String | '' | 下拉面板自定义 CSS 类名 |
| getPopupContainer | Function | null | 下拉面板挂载容器 (triggerNode) => HTMLElement |
| zIndex | Number | 1050 | 下拉框层级 |
| placeholder | String | '请选择' | 占位符文本 |
| disabled | Boolean | false | 是否禁用 |
12.6 TreeSelect API 方法
| 方法 | 参数 | 返回 | 说明 |
|---|---|---|---|
| getValue() | - | Any|Array | 获取当前选中值 |
| setValue(val) | val | void | 设置选中值 |
| open() | - | void | 打开下拉框 |
| close() | - | void | 关闭下拉框 |
| checkAll() | - | void | 全选树节点 |
| uncheckAll() | - | void | 取消全选 |
| setLoading(key, loading) | key, loading | Boolean | 设置树节点加载状态 |
| scrollTo(key) | key | Boolean | 滚动到指定树节点 |
| search(keyword) | keyword: String | void | 搜索过滤树节点 |
| destroy() | - | void | 销毁实例 |