---
url: /components/context-menu.md
---
# ContextMenu 右键菜单

在光标处弹出的上下文菜单：默认插槽包裹触发区域，区域内右键即弹出（自动阻止浏览器默认菜单）；`items` 配置驱动菜单内容，也可命令式调用按目标切换菜单，弹层 Teleport 至 body、视口边缘自动翻转钳位。

## 基础用法

把需要响应右键的内容写入默认插槽，菜单项通过 `items` 配置：`label` 文本、`icon` 图标、`command` 指令值（支持字符串、数字、对象等任意类型），点击菜单项抛出 `command` 事件并自动收起。

## 菜单项形态

`disabled` 置灰禁点、`divided` 顶部分隔线、`danger` 标识删除类危险操作（红色，悬停不转主色）。

## 子菜单

菜单项带 `children` 数组即展开一级子菜单：悬停延时弹出、点击父项也可展开；子菜单默认挂在右侧，视口右侧放不下自动翻到左侧，纵向始终钳位在视口内。父项与子项共用同一个 `command` 事件。

## 命令式调用

不写默认插槽时组件只是命令式引擎：通过模板 ref 调用 `open`，第一个参数传 MouseEvent 或 `{ x, y }` 坐标点，第二个参数可传入临时 items 覆盖配置——同一个菜单实例即可服务多个目标，各自弹出各自的菜单。`close` 与 `visible` 程序化控制显隐，`visible-change` 监听开关。

## API