Skip to content

ContextMenu ​

Menu component.

Props ​

AttributeDescriptionTypeDefault
show(v-model)Controls whether the menu is displayedboolean—
optionsMenu options, See MenuOptionsMenuOptions—

Events ​

Event nameDescriptionArguments
closeThis event is triggered when the menu is closed-

Slots ​

Slot nameDescriptionArguments
itemRenderGlobal menu item render slotMenuItemRenderData
itemIconRenderGlobal menu item icon render slotMenuItemRenderData
itemLabelRenderGlobal menu item label render slotMenuItemRenderData
itemRightArrowRenderGlobal menu item right arrow render slotMenuItemRenderData
itemCheckRenderGlobal menu check mark render slotMenuItemRenderData
itemShortcutRenderGlobal menu shortcut key badge render slotMenuItemRenderData
separatorRenderGlobal menu separator render slot-

ContextMenuInstance ​

ContextMenu Component ref interface,

You can use (this.$refs.myMenu as ContextMenuInstance) or const mymenu = ref<ContextMenuInstance>().

closeMenu(fromItem?: MenuItem|undefined): void ​

Close this menu..

ParamExplain
fromItemThe last clicked menu item, will pass to MenuOptions.onClose callback, if user does not click any item, can be undefined.

isClosed(): boolean ​

Check if the menu is currently closed.

Returns

Explain
Is this menu currently closed

getMenuRef(): ContextSubMenuInstance ​

Get current Menu root instance.

Returns

Explain
Return ContextSubMenuInstance of root, return undefined if menu is not showing.

getMenuDimensions(): { width: number, height: number } ​

Get root menu size.

Returns

Explain
Return root menu size in pixel, return all zero if menu is not showing.
PropertyDescriptionType
themeMenu theme'light' 'dark'
isOpenThis value indicates whether the current menu submenu is openboolean
hasChildrenThis value indicates whether the current menu has submenusboolean
onClickDefine the click event callback of the element, which is used for the internal event processing of the menu. When rendering item with slot, please call this function back, otherwise the menu cannot respond to the event normally-
onMouseEnterMouse in event callback of custom element. When rendering item with slot, please call this function back, otherwise the menu cannot respond to the event normally-
closeCalling this function will close the current menu-
...Other arguments are same with MenuItem-

Released under the MIT License.