级联选择器
Cascader
初级通用级联选择器（Cascader）是让你沿着多级分类逐层选取项目的表单控件。它解决了层级选项太多、单个下拉列表难找的问题，例如在商品后台依次选择「家电、厨房电器、咖啡机」。
你可能会说：「我想让用户先选大类，再看到对应的小类，最后选到具体分类，不用翻一长串选项。」
动手看看商品分类级联选择
展开分类选择器
已选分类路径
把「已选分类路径」从尚未选择依次切到家电、厨房电器、咖啡机，看看右侧如何逐级出现；也可以悬停或用 Tab 聚焦选项。
分类面板浮在表单上方，挡住了商品名称和价格，但没有接管整页；切换「展开分类选择器」就能收起它。
要点级联选择器是怎么一步步选到结果的？
- 1
上一级决定下一级选项
你选了「家电」，下一层才出现它下面的分类；改选「服饰」，下一层也跟着换。因为选项有父子关系，所以用户不用在所有分类里逐个找。
- 2
展示路径与提交值要分清
界面可以显示「家电 / 厨房电器 / 咖啡机」，让用户知道自己选到了哪里；提交给系统的则可能是末级分类 ID，也可能是整条路径。和 AI 协作时，把这点说清楚。
- 3
选到哪一级算完成由业务定
有的商品只能归到末级分类，有的地区选择允许停在「省」或「市」。因为完成条件不同，控件的确认时机和表单校验也会不同，不能只凭界面层数推断。
容易混淆的地方
普通选择器通常让你从一组并列选项里挑一个；级联选择器处理的是「选了上一级，才确定下一级有哪些」的层级关系。树选择也能处理层级，但更强调在树状结构中浏览节点，常用于勾选多个部门或节点；级联选择器更适合沿一条路径逐层定位。
什么时候用
适合用
- 做商品发布后台时，分类有大类、子类和末级类，商家需要沿分类路径选定归属。
- 做工单表单时，问题类型分成产品、功能、具体故障，多级选项会随前一层变化。
- 做地址表单时，地区数据按省、市、区组织，用户需要逐层选到配送区域。
不适合用
- 套餐只有基础版、专业版、团队版三个并列选项，用单选框或普通选择器更直接。
- 管理员要一次勾选多个不同分支下的部门，树选择比沿单条路径选择更合适。
- 用户只需输入已知的商品编号，直接用输入框或带建议的搜索框，不必浏览分类层级。
练一练选一个答案，看看解释
你在做报修表单：故障目录分为「设备类型 → 部件 → 故障现象」，用户每次只提交一种故障。该怎么设计这个字段？
让 AI 帮你做复制给 AI Agent 直接用
请在报修表单中实现一个级联选择器，按「设备类型 → 部件 → 故障现象」逐层显示选项，前一级变化时清空已选的后续级。只允许选到故障现象后提交；界面显示完整路径，表单提交末级故障 ID，并处理无子项的情况。