用大白话向 AI 描述下拉

需要说清以下 4 件事：

• 01 谁来触发：点击哪个元素展开下拉。
• 02 面板放什么：下拉菜单里包含哪些选项或内容。
• 03 怎么选：用户如何与选项交互（单选、多选、搜索等）。
• 04 哪里变化：选中后，页面哪些部分会更新反馈。

1. 分组下拉

适用于选项很多、需要按类别分组整理的场景。

交互流程：点击字段 → 展开列表 → 按组滚动浏览 → 选中具体项 → 回填字段并更新内容。

关键特征：分组标题（组名）不可点击，只起分类作用。

选中反馈：真正选中某一项后，字段回填该项名称，右侧关联内容同步切换。

2. 可搜索组合框

适用于选项太多、靠滚动不好找的场景，可以直接输入关键词筛选。

交互流程：点击输入框 → 展开候选项 → 连续输入关键词 → 实时缩小结果范围 → 点中匹配项 → 回填并切换关联内容。

关键特征：边输入边筛选，输入越完整，候选范围越小。

3. 拆分按钮

适用于一个按钮既有常用动作、又有备选动作的场景。

交互流程：点击按钮主体 → 直接执行默认操作；点击右侧小箭头 → 展开其他备选操作。

关键特征：默认动作随时可用，备选动作需展开选择。

4. 日期选择器

适用于需要选择某一天，或者一段日期范围的场景。

交互流程：点击日期字段 → 打开日历 → 先选开始日期 → 再选结束日期 → 中间范围连续高亮 → 确认后回填完整日期区间。

5. 级联选择器

适用于选项有明确上下级关系、需要一层层找到具体项目的场景。

交互流程：点击第一级 → 向右展开下一列 → 逐级选择 → 选到末级 → 回填完整路径。

6. 多选下拉

适用于需要一次选中多个选项的场景。

交互流程：展开列表 → 连续勾选多项 → 字段生成标签并更新数量 → 点击标签关闭按钮可单独取消一项。

关键特征：勾选的选项会依次变成标签，删除其中一个标签，数量和关联结果同步更新。

7. 大型下拉菜单

适用于导航内容很多、需要同时展示多列分类、图标和说明的场景。

交互流程：鼠标移到主导航 → 展开大型面板 → 切换左侧分类 → 中间子菜单和右侧说明同步变化 → 点击入口进入对应页面。

8. 触发方式

虽然都是从按钮或字段往下展开，但解决的其实是八种不同问题：单选、分类、搜索、动作、日期、层级、多选和导航。

描述要点：触发方式、能选几个、选项有没有层级、选完以后页面怎么反馈，这些都不一样。

总结：不要只和 AI 说“做个下拉”，要把“谁来触发、面板里放什么、用户怎么选、选完哪里变化”一起说清楚。

知识小结