ContextMenu 右键菜单

在包裹区域内右键弹出菜单，菜单定位在鼠标位置。

基础用法

右键触发

在此区域右键查看菜单

示例代码

禁用项

禁用项

右键查看（删除不可用）

示例代码

多级子菜单

多级子菜单

右键查看多级子菜单

示例代码

带 children 的菜单项 hover / 点击展开级联子菜单，选中叶子项后自动收回并关闭。

选择事件

选择事件

在此区域右键

尚未选择

示例代码

编程式定位与受控 open

show(x, y) / close()

在 (140, 120) 打开关闭未打开

此区域右键打开，或点上方按钮以任意坐标打开

示例代码

show(x, y) 可在任意坐标弹菜单（表格行 / 画布 / 选区右键等脱离宿主元素的场景），close() 编程式关闭；open 属性受控开关，开合状态经 oas-open-change 事件感知。

长按触发（移动端）

移动端没有右键，长按（默认 500ms）即触发菜单；long-press-delay 可调时长（毫秒）。桌面浏览器可用 DevTools 设备模拟验证。

长按触发

移动端长按此区域打开菜单

示例代码

滚动关闭

菜单为 fixed 定位，打开后滚动页面或内部滚动区域默认自动关闭（避免与内容脱节）；close-on-scroll="false" 可关闭该行为。

滚动关闭

右键打开菜单后滚动下方区域，菜单即关闭

右键我：close-on-scroll="false" 滚动不关闭

滚动内容……（菜单打开后在此滚动即自动关闭）

示例代码

API

属性

属性	说明	类型	默认值
close-on-scroll	页面滚动时关闭菜单（默认 true）	string	true
items	菜单项 JSON	string	[]
long-press-delay	移动端长按触发时长毫秒数（默认 500）	string	500
open	受控展开态（外部可写）	boolean	—

事件

事件	说明
oas-open-change	菜单开合变化，detail: { open: boolean }
oas-select	选择某项，detail: { value }

插槽

名称	说明
默认	—

鼠标位置弹出，Esc / 外部点击 / 选择后自动关闭；role="menu" + menuitem。