树形多选的父子联动，首先要明确勾选结果包含谁。父节点通常代表对子节点的一次批量选择，半选表示其中只有部分可选项被选中；展开箭头只负责查看子节点，不改变选择。禁用节点是否参与联动、未加载子节点是否计入“全选”，也必须在画面之外写成规则。
下面为虚构的培训通知 T-028 选择接收部门。先制作部门选择的交互原型，再用一份固定的部门树走完勾选、取消和确认，能及时发现“看起来选了整个部门，实际只选了部分子项”的问题。
先固定部门树和最终提交的对象
本例的树共有三个层级，所有节点在首次显示前已加载完成。组织节点只负责分组，最终提交的是可选末级部门 ID；父节点 ID 不写入接收部门集合，也不额外计算成一个部门。接收人数由业务系统另算，不把部门数当成人数。
| 节点 ID | 层级与名称 | 是否可选 | 初始状态 |
|---|---|---|---|
| ORG | 启明科技 | 可操作，联动可选末级部门 | 未选、展开 |
| PROD | 启明科技 / 产品中心 | 可操作，联动两个子部门 | 未选、展开 |
| P01 | 产品中心 / 产品一部 | 可选末级部门 | 未选 |
| P02 | 产品中心 / 产品二部 | 可选末级部门 | 未选 |
| MARKET | 启明科技 / 市场中心 | 可操作，联动可选子部门 | 未选、展开 |
| M01 | 市场中心 / 品牌部 | 可选末级部门 | 未选 |
| M02 | 市场中心 / 活动部 | 禁用；不在本次通知范围 | 固定未选 |
初始选中集合为空。本例唯一可选集合为 {P01, P02, M01}，共 3 个部门；M02 始终未选、不参与全选分母、不能被父级勾选带入。活动部旁显示“本次培训不包含该部门”，避免只有灰色外观而没有解释。
这是一种明确选择的业务策略，并非所有树组件都必须如此。Ant Design 对勾选传导的说明就讨论了不同策略，并解释其组件如何在禁用节点处停止传导。若你的业务允许某个禁用子项保持历史选中，必须另写规则；不能与本例的“固定未选”混用。
父节点的半选状态，按可选叶节点计算
对一个父节点，查看其范围内的可选末级部门：一个没选是未选，全部选中是全选，只选了一部分是半选。市场中心只有品牌部一个可选子部门，因此选中品牌部后，市场中心显示全选；活动部仍为禁用未选。这里的全选含义是“已选完可选项”，不是“画面上每一行都被选中”。
本例把点击半选框定义为“补选该范围内其余可选项”，点击全选框定义为“取消该范围内所有可选项”。不要让半选框随机切换成未选，也不要仅凭视觉形态让研发猜测下一步。
| 按顺序执行的操作 | 选中叶节点集合 | 数量 | 父级反馈 |
|---|---|---|---|
| 从初始状态勾选产品中心 | {P01, P02} | 2 | 产品中心全选；启明科技半选 |
| 取消产品二部 | {P01} | 1 | 产品中心、启明科技均半选 |
| 点击半选的启明科技 | {P01, P02, M01} | 3 | 两个中心与启明科技均全选；活动部仍禁用未选 |
| 取消市场中心 | {P01, P02} | 2 | 产品中心全选；市场中心未选；启明科技半选 |
| 取消产品中心 | {} | 0 | 所有可操作节点均未选 |
这张表可以直接作为交付说明。研发和测试从同一个空集合起步，逐行执行，才能核对状态；每一步都重新从空集合开始，会得到另一组结果。原型画面也应沿用这些节点 ID 和部门名，避免把两个同名部门当成同一个对象。
展示一个父级标签，不等于只提交一个父级
勾选产品中心后，选择框可以显示“产品中心（2 个部门）”，减少标签拥挤；展开摘要则列出产品一部与产品二部。提交仍是 {P01, P02}。用户删除这个父级标签时，取消它代表的两个子部门，数量归零。
当只选产品一部时，不应仍显示没有说明的“产品中心”标签。可显示“产品一部”，并在详情中保留所属路径。TreeSelect 文档区分了父子独立选择和选中项展示策略；界面压缩标签的方式，不能代替业务对选中集合的定义。
在产品中心全选的例子中，提交前的摘要写“已选 2 个部门”，列出具体末级部门，不写“已选 2 项”；其他状态按实际选中的可选叶节点数量更新。如果这是一张编辑中的通知表单，点击“确认选择”只是将集合带回表单；并不表示已经发送培训通知。真正的发送按钮仍在通知提交步骤中。
未加载的子节点，不能假装已经选完
上面的演示采用完整加载，因此全选范围是确定的。如果实际部门很多、展开后才加载子节点，需要重新定义父级勾选：可以先加载全部可选后代再确认，也可以由服务端支持“选中这个范围及排除项”。两者都需要数据契约，不能把前端当前看到的几行当成整个部门。
对培训通知这种需要核对准确部门列表的任务，一个容易解释的方案是：点击尚未加载完整的父级后，显示“正在读取可选部门”，暂不改变最终已选集合；读取成功后展示本次将增加的部门并确认。失败时保留原集合，显示“部门未加载完整，重试后再选择此范围”，不要先显示全选成功再悄悄撤回。
搜索结果也只是视图。若搜索后只剩“产品一部”，顶层操作应明确写“选择搜索结果”，并列出结果数量；它不能继续无说明地叫“全选”。清除搜索后要恢复原树和全部已选项，不能丢掉暂时不可见的选择。
展开、焦点和选择要分别走查
把展开箭头与复选框的点击区域分开：点箭头只展开或收起，点复选框才改变集合，点标签采用哪种动作则保持全树一致。收起产品中心之后，已选的产品一部仍在集合中，父级半选标记和底部数量不能消失。
键盘焦点也不等于选择。WAI-ARIA 的树视图模式区分了焦点、选中和展开等行为。设计交付应标出焦点落在哪一行、如何展开、如何勾选，并把半选和禁用原因传达给辅助技术；画一个短横线图标本身并不完成这些行为。
在墨刀里可为上表五步分别建立页面状态，用点击跳转串联，并在页面旁写明选中 ID 集合。评审者按顺序操作后，再从产品中心全选、共选中 2 个部门的状态出发，走一次“收起产品中心—展开—删除产品中心标签”的回程，确认最终数量归零、选中集合为空。父子状态的视觉细节可结合UI 组件状态设计继续梳理，其他选择类组件可在UI 与界面设计专题中按任务查找。
