Dropdown 下拉菜单

可切换的菜单，用于显示链接和操作列表。

基础用法

将鼠标悬停在下拉菜单上，展开以查看更多操作。

位置

支持 6 种不同的弹出位置。

触发元素

使用按钮来触发下拉菜单。

触发方式

点击触发元素或将鼠标悬停在上面。

使用 hide-on-click 来定义点击菜单项后是否关闭菜单。

指令事件

点击每个下拉菜单项都会触发一个事件，其参数由每个菜单项指定。

你可以通过手动调用 handleOpen 或 handleClose 来打开或关闭下拉菜单。

尺寸

除了默认尺寸外，Dropdown 组件还提供了三种额外的尺寸，供你在不同场景中选择。

虚拟触发 2.11.3

有时我们希望在其他触发元素上渲染下拉菜单，我们可以将触发器和内容分开。

名称	描述	类型	默认值
type	菜单按钮类型，参考 `Button` 组件，仅在 `split-button` 为 true 时有效	`枚举`	''
size	菜单尺寸，也适用于分裂按钮	`枚举`	''
button-props	按钮组件的 props，参考 Button 属性	`object`	—
max-height	菜单的最大高度	`string` / `number`	''
split-button	是否显示按钮组	`boolean`	false
disabled	是否禁用	`boolean`	false
placement	弹出菜单的位置	`枚举`	bottom
effect	Tooltip 的主题，内置主题：`dark` / `light`	`enum` / `string`	light
trigger	触发方式	`枚举` / `对象`	悬浮时
trigger-keys 2.9.1	指定按下键盘上哪些键可以触发	`array`	`['Enter', 'Space', 'ArrowDown', 'NumpadEnter']`
virtual-triggering 2.11.3	表示是否启用虚拟触发	`boolean`	—
virtual-ref 2.11.3	表示下拉菜单附加到的参考元素	`HTMLElement`	—
hide-on-click	点击菜单项后是否隐藏菜单	`boolean`	true
show-arrow 2.11.3	提示框内容是否有箭头	`boolean`	true
show-timeout	显示下拉菜单前的延迟时间（仅在 trigger 为 `hover` 时有效）	`number`	150
hide-timeout	隐藏下拉菜单前的延迟时间（仅在 trigger 为 `hover` 时有效）	`number`	150
role	下拉菜单的 ARIA role 属性。根据用例，您可能希望将其更改为 'navigation'	`枚举`	menu
tabindex	Dropdown 的 tabindex	`number` / `string`	0
popper-class	Dropdown 下拉菜单的自定义类名	`string` / `object`	''
popper-style 2.11.5	Dropdown 下拉菜单的自定义样式	`string` / `object`	—
popper-options	popper.js 参数	`object`	`{modifiers: [{name: 'computeStyles',options: {gpuAcceleration: false}}]}`
teleported 2.2.20	下拉菜单弹出框是否传送到 body	`boolean`	true
persistent 2.9.5	当下拉菜单不活动且 `persistent` 为 `false` 时，下拉菜单将被销毁	`boolean`	true

名称	描述	子标签
default	Dropdown 的内容。注意：必须是有效的 html dom 元素（例如 `<span>, <button> 等`）或 `el-component`，以附加触发侦听器	—
dropdown	下拉菜单的内容，通常是 `<el-dropdown-menu>` 元素	Dropdown-Menu

名称	描述	类型
click	如果 `split-button` 为 `true`，则在点击左侧按钮时触发	`Function`
command	当点击下拉菜单项时触发，参数是下拉菜单项派发的 command	`Function`
visible-change	当下拉菜单出现/消失时触发，出现时参数为 true，否则为 false	`Function`

方法	描述	类型
handleOpen	打开下拉菜单	`Function`
handleClose	关闭下拉菜单	`Function`

名称	描述	子标签
default	下拉菜单的内容	Dropdown-Item

名称	描述	类型	默认值
command	要分派给 Dropdown 的 `command` 回调的指令	`string` / `number` / `object`	—
disabled	该项是否被禁用	`boolean`	false
divided	是否显示分割线	`boolean`	false
icon	自定义图标	`string` / `Component`	—