TreeSelect 树选择

TreeSelect 适合“下拉选择 + 树结构浏览”同时存在的输入场景，比如目录、组织架构、权限树、资源分类和发布范围。视觉使用 Rue 的 input / badge / base 色阶体系，能力覆盖 treeData、simple mode、多选、勾选、语义值、异步加载和 filled / warning 等核心场景。

基础能力

先把单选、搜索和清空打稳，再把 simple mode、多选与勾选这些更接近业务配置面的能力接进来。

# Basic

单选、搜索、默认展开与 allowClear 的组合，是目录选择最常见的入口。

当前节点：docs

# Without allowClear

未开启 allowClear 时，只保持选择交互，不显示 selector 右侧的清空入口。

当前节点：docs

# Simple Mode

扁平树数据直接接入，适合后端给的是 id / pId 结构时减少前置整理成本。

当前目标：workflow

这类接口在 CMS、流程平台、低代码配置里很常见。只要给出 id / pId / value / title 映射，就能直接恢复成可搜索树。

# Multiple

多选模式默认以标签回填，适合通知订阅、面板订阅、资源批量绑定。

已选：analytics / minutes

# Checkable

勾选树会把多选语义进一步贴近权限树和发布范围；默认 SHOW_CHILD 会直接回填实际勾选的子节点。

回填：build / quality

策略当前示例使用默认 SHOW_CHILD，选了哪些子节点就回填哪些子节点，更适合精确范围选择。
切换如果业务更想要紧凑展示，可以把 showCheckedStrategy 改成 TreeSelect.SHOW_PARENT，让完整分组选中时折叠成父标签。
回填当前示例最多展示两个标签，更多已选项会用 ... 收起，避免 selector 被撑成两排。

高级能力

语义值、异步加载和外观变体覆盖配置类面板里的常见选择场景。

# Label In Value

当业务既要 value 也要 label 时，直接回填结构体会更顺手。

当前结构：{"value":"release","key":"release","label":"发布管道"}

# Async Load

展开未加载分支时触发 loadData，适合远端目录、权限树和超大分类树。

当前节点：尚未选择

第一次展开“按需加载目录”时会把子节点注入到 treeData，这个模式适合服务端分页目录和按需权限树。

# Variant and Status

TreeSelect 也使用 Rue 当前输入体系的 filled / warning 视觉语义。

ENV

请选择

可清空

当前环境：prod

prefix / suffix 让 TreeSelect 能自然落进环境切换、租户切换和带状态提醒的配置表单里。

API

属性	说明	类型	默认值
`allowClear`	追加清空按钮，适合单选、多选和勾选模式统一收敛到一个入口	`boolean \| { clearIcon?: any }`	`false`
`fieldNames`	映射 label、value、children、key 与 simple mode 的 id / pId 字段	`TreeSelectFieldNames`	`{ title, value, children, key }`
`labelInValue`	把回填值组织为 { value, key, label, halfChecked } 结构	`boolean`	`false`
`loadData`	展开未加载节点时触发异步加载，适合目录、权限树、远端分类场景	`(node) => Promise<any> \| void`	`-`
`maxCount`	限制多选 / 勾选模式下最多展示并回填多少个节点	`number`	`-`
`multiple`	多选模式，已选项会回填为标签列表	`boolean`	`false`
`showCheckedStrategy`	控制 treeCheckable 时的回填策略，支持 SHOW_ALL / SHOW_PARENT / SHOW_CHILD	`TreeSelectShowCheckedStrategy`	`SHOW_CHILD`
`showSearch`	开启搜索输入；对象模式可配置 autoClearSearchValue、filterTreeNode 与 onSearch	`boolean \| TreeSelectShowSearchConfig`	`单选 false / 多选 true`
`treeCheckable`	把树节点切到 checkbox 模式，适合权限树、发布范围、分类选择	`boolean`	`false`
`treeData`	树数据源，title / value / children 为常用字段，value 在整棵树里需要唯一	`TreeSelectDataNode[]`	`[]`
`treeDataSimpleMode`	接收扁平结构树数据，并通过 id / pId 自动恢复层级	`boolean \| { id?: string; pId?: string; rootPId?: string \| number \| null }`	`false`
`treeDefaultExpandAll / treeExpandedKeys`	控制树默认展开和受控展开，便于做大树分层浏览	`boolean / TreeSelectValue[]`	`false / -`
`treeNodeFilterProp`	搜索命中用的字段，常见设置是 title 或自定义 label 字段	`string`	`value`
`variant / status`	使用 Rue 输入类组件的视觉语义，支持 filled、borderless、underlined 与 warning/error	`'outlined' \| 'filled' \| 'borderless' \| 'underlined' / 'warning' \| 'error'`	`'outlined' / -`