Dropdown 下拉菜单
点击触发器展开菜单，浮层定位到触发元素旁。
基础用法
点击触发
触发方式
trigger 控制触发方式：click（默认）/ hover / focus，可空格分隔多选（如 "click hover"）。hover 触发时 hover-delay / hover-hide-delay 控制开合防抖延时（默认 150 / 100ms，无延时 hover 会闪开闪关）；悬停区域为触发器 + 浮层面板（跨间隙移动不闪关）。
悬停触发
聚焦触发
多触发（click + hover）
自定义开合延时
放置方向
四个方向
12 向放置
placement 支持 12 向：四基向 top / bottom / left / right 各配 -start / -end 交叉轴对齐（bottom-start 面板左缘对齐触发器左缘，是最常见形态）。空间不足沿主轴翻转时对齐后缀保留（bottom-start → top-start），对齐后仍做视口夹取。
12 向放置
多级子菜单
items 项支持 children 数组级联子菜单（任意层级），hover / 点击展开，选中叶子项后自动收回并关闭；浮层菜单复用了 oas-menu 渲染，多级子菜单贴近视口边缘时自动向左 / 向上翻转保证完整可见。
多级子菜单
禁用项
禁用项
整体禁用
disabled 禁用整个下拉：点击 / 悬停 / 聚焦均不响应，拆分箭头按钮置灰，宿主降饱和（opacity .6）并同步 aria-disabled。
整体禁用
箭头
菜单面板带指向触发元素的箭头。arrow 属性控制显隐（默认显示，arrow="false" 隐藏）；arrow-point-at-center 让箭头固定指向面板中心（默认按触发元素投影定位，面板被视口避让偏移时箭头仍指向触发元素）；auto-adjust-overflow 控制视口空间不足时是否自动翻转（默认开启）。
带箭头
箭头显隐
箭头指向中心与关闭翻转
选择事件
选择事件
选中不关闭
hide-on-click 控制选中菜单项后是否关闭（默认 true 选中即关；"false" 时保持打开，适合多选 / 勾选场景）。
选中不关闭
受控显示
open 属性受控：外部按钮设置 / 移除 open 控制菜单显隐（点击外部 / Esc / 选择后仍会关闭）。
受控显示（open 属性）
开合事件反馈
组件自己开关（点击 / 悬停 / 聚焦 / Esc / 外部点击 / 选中）都会派发 oas-open-change（detail: { open }），受控模式下宿主据此同步状态（与 tooltip / popover 语义一致，外部写 open 同样触发）。
oas-open-change 事件
偏移与滚动
offset 调整浮层与触发器的间距（默认 8px）。页面滚动时浮层默认跟随触发器重算位置（fixed 定位与页面脱节修复）；close-on-scroll 改为滚动即关闭。
偏移（offset）
滚动关闭（close-on-scroll）
受控选中项
value 属性受控：外部设置 value 指定选中项（下拉菜单无勾选标识，用标签实时回显当前值）；选择菜单项同样会更新 value 并派发 oas-select。
受控选中（value 属性）
拆分下拉按钮
split 属性开启下拉按钮模式：主按钮 + 拆分箭头按钮。点箭头展开菜单，点主按钮派发 oas-action（绑定执行主操作，如保存）；菜单选择仍走 oas-select。
拆分下拉按钮
主按钮动作事件
加载中菜单项
菜单项配置 loading: true 即进入加载态：该项显示旋转 spinner、禁点（点击 / 键盘 / hover 均拦截），异步完成后更新 items 移除 loading 即恢复。下面的异步演示：选择「保存」后该项转圈禁点约 1.5 秒，随后恢复。
loading 菜单项
异步操作演示
API
属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
arrow | 是否显示指向触发元素的箭头（arrow="false" 隐藏，骨架保留） | string | true |
arrow-point-at-center | 箭头固定指向面板中心（默认按触发元素投影定位，面板被视口避让偏移时箭头仍指向触发元素） | boolean | — |
auto-adjust-overflow | 视口空间不足时自动翻转/避让（auto-adjust-overflow="false" 关闭，面板可越出视口） | string | true |
close-on-scroll | 页面滚动时关闭浮层（默认重定位跟随；true 时滚动即关） | boolean | — |
disabled | 整体禁用：不响应任何触发 | boolean | — |
hide-on-click | 选中项后是否关闭（默认 true；false 时选中不关闭，多选/勾选场景） | string | true |
hover-delay | hover 触发时展开延迟毫秒数（默认 150） | — | — |
hover-hide-delay | hover 触发时收起延迟毫秒数（默认 100） | — | — |
items | 菜单项 JSON | string | [] |
offset | 浮层与触发器的间距像素（默认 8） | — | — |
open | 受控显示（布尔属性，存在即展开） | boolean | — |
placement | 浮层位置 | string | bottom |
split | 拆分下拉按钮（布尔属性）：主按钮 + 箭头按钮，点箭头开菜单、主按钮派发 oas-action | boolean | — |
trigger | 触发方式：click（默认）/ hover / focus，空格分隔可多选（如 "click hover"） | string | click |
value | 当前选中值 | string | — |
事件
| 事件 | 说明 |
|---|---|
oas-action | 拆分模式下点击主按钮，detail: { originalEvent } |
oas-open-change | 浮层开合变化，detail: { open: boolean }（含外部 setAttribute 触发，受控闭环） |
oas-select | 选择某项，detail: { value } |
插槽
| 名称 | 说明 |
|---|---|
| 默认 | — |
点击触发器切换显隐，点击外部 / 按 Esc / 选择后关闭；浮层为内层 oas-menu（role="menu"，叶子项 menuitemradio、带子菜单项 menuitem），支持多级级联子菜单与键盘导航。