EtDropdown · 工具界面下拉
底座 EbDropdown 的密度适配包装:props/events/slots 全透传,菜单走工具密度令牌。
vue
<et-dropdown trigger="click" placement="bottom-end" @command="onCommand" @visible-change="onVisible">
<template #trigger>
<et-tool-button size="small" icon="more" label="更多" />
</template>
<template #dropdown>
<eb-dropdown-menu>
<eb-dropdown-item command="copy" icon="copy" label="复制" />
</eb-dropdown-menu>
</template>
</et-dropdown>API
Props
无声明式 props,属性经 $attrs 透传给底座
Emits
| 事件 | 载荷 | 说明 |
|---|---|---|
| visible-change | v | 浮层显隐变化(底座透传);载荷 = 是否展开 |
| command | c | 菜单项被选中(底座透传);载荷 = 该项 command |
| click | e | 触发器被点击(底座透传);载荷 = 原生 MouseEvent |
Slots
底座命名槽原样透传
键盘 · 可访问名 · 密度
| 键盘 | 不接管按键 |
|---|---|
| 可访问名 | 无 ARIA 属性(原生语义) |
| 密度 | 不引用度量令牌(随内容或宿主) |
行为
- 暴露
open()/close()(转发底座命令式方法)。 - 密度覆盖写在全局底座浮层类上:
EbDropdown的浮层经<Teleport to="body">渲染,popper 容器类固定、不接受外部注入,故--et-menu-*落在.eb-dropdown__popper。加载了本库样式的工具界面即生效。
令牌与门禁
--et-menu-item-height/--et-menu-icon-gutter等菜单密度令牌。- G1:只引用
--et-*/--eb-*,禁裸色值。