---
title: "Ext.menu.Menu"
description: "xtype 为 menu 的 Ext JS 原生组件参考。"
---

> Documentation Index
> Fetch the complete documentation index at: https://ag.879818327.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# Ext.menu.Menu

源码定义：`ext-all-debug.js:137070`。分类：按钮、工具栏、菜单与标签页。

## 创建示例

```javascript
var component = Ext.create("Ext.menu.Menu", {
  xtype: "menu",
  allowOtherMenus: false,
  ariaRole: 'menu',
  constrain: true,
  defaultAlign: 'tl-bl?',
  renderTo: Ext.getBody()
});
```

## 属性

| 属性 | 类型 | 默认值 | 说明 | 配置示例 |
| --- | --- | --- | --- | --- |
| `allowOtherMenus` | `Boolean` | `false` | 控制是否启用 `allowOtherMenus` 行为。 | `allowOtherMenus: false` |
| `ariaRole` | `String` | `'menu'` | 组件在辅助技术中的 ARIA 角色。 | `ariaRole: 'menu'` |
| `constrain` | `Boolean` | `true` | 控制是否启用 `constrain` 行为。 | `constrain: true` |
| `defaultAlign` | `String` | `'tl-bl?'` | 配置组件的 `defaultAlign` 选项。 | `defaultAlign: 'tl-bl?'` |
| `defaultMinWidth` | `Number` | `120` | 配置组件的 `defaultMinWidth` 选项。 | `defaultMinWidth: 120` |
| `enableKeyNav` | `Boolean` | `true` | 控制是否启用 `enableKeyNav` 行为。 | `enableKeyNav: true` |
| `floating` | `Boolean` | `true` | 控制是否启用 `floating` 行为。 | `floating: true` |
| `hidden` | `Boolean` | `true` | 控制组件初始是否隐藏。 | `hidden: true` |
| `hideMode` | `String` | `'visibility'` | 配置组件的 `hideMode` 选项。 | `hideMode: 'visibility'` |
| `ignoreParentClicks` | `Boolean` | `false` | 控制是否启用 `ignoreParentClicks` 行为。 | `ignoreParentClicks: false` |
| `initFloatConstrain` | `Mixed` | `Ext.emptyFn` | 配置组件的 `initFloatConstrain` 选项。 | `initFloatConstrain: Ext.emptyFn` |
| `initHierarchyEvents` | `Mixed` | `Ext.emptyFn` | 配置组件的 `initHierarchyEvents` 选项。 | `initHierarchyEvents: Ext.emptyFn` |
| `isMenu` | `Boolean` | `true` | 控制是否启用 `isMenu` 行为。 | `isMenu: true` |
| `minWidth` | `Mixed` | `undefined` | 配置 `minWidth` 限制值。 | `minWidth: undefined` |
| `showSeparator` | `Boolean` | `false` | 控制是否显示 `separator`。 | `showSeparator: false` |

## 方法

| 方法 | 参数 | 说明 | 调用示例 |
| --- | --- | --- | --- |
| `initComponent` | `` | 初始化组件及其子项。 执行时会保留父类默认行为、更新 `cls`、`bodyCls` 状态。源码涉及 `addEvents()`、`callParent()`、`getLayout()`。 | `component.initComponent()` |
| `getHierarchyState` | `` | 调用并直接返回父类的值，不对结果作额外转换。 | `component.getHierarchyState()` |
| `beforeRender` | `` | 生成 `before` 的渲染结果。 执行时会保留父类默认行为。源码涉及 `callParent()`、`getSizeModel()`。 | `component.beforeRender()` |
| `onBoxReady` | `` | 处理 `boxReady` 回调。 执行时会保留父类默认行为、更新 `iconSepEl`、`mouseMonitor` 状态。源码涉及 `callParent()`、`mon()`、`onClick()`、`getKeyMap()`。 | `component.onBoxReady()` |
| `canActivateItem` | `item` | 处理 `canActivateItem` 操作。 | `component.canActivateItem(...)` |
| `deactivateActiveItem` | `andBlurFocusedItem` | 停用 `activeItem`。 | `component.deactivateActiveItem(...)` |
| `getFocusEl` | `` | 读取并返回 `focusEl`。 | `component.getFocusEl()` |
| `hide` | `` | 隐藏组件。 执行时会保留父类默认行为。源码涉及 `deactivateActiveItem()`、`callParent()`。 | `component.hide()` |
| `getItemFromEvent` | `e` | 读取并返回 `itemFromEvent`。 | `component.getItemFromEvent(...)` |
| `lookupComponent` | `cmp` | 查找 `component`。源码涉及 `lookupItemFromString()`、`lookupItemFromObject()`。 | `component.lookupComponent(...)` |
| `lookupItemFromObject` | `cmp` | 查找 `itemFromObject`。 | `component.lookupItemFromObject(...)` |
| `lookupItemFromString` | `cmp` | 查找 `itemFromString`。 | `component.lookupItemFromString(...)` |
| `configureItem` | `cmp` | 处理 `configureItem` 操作。 执行时会保留父类默认行为。源码涉及 `callParent()`。 | `component.configureItem(...)` |
| `onClick` | `e` | 处理 `click` 回调。 执行时会派发 `click` 事件。源码涉及 `getItemFromEvent()`、`fireEvent()`。 | `component.onClick(...)` |
| `onDestroy` | `` | 处理 `destroy` 回调。 执行时会保留父类默认行为、更新 `parentMenu`、`ownerCmp` 状态。源码涉及 `callParent()`。 | `component.onDestroy()` |
| `onMouseLeave` | `e` | 处理 `mouseLeave` 回调。 执行时会派发 `mouseleave` 事件。源码涉及 `deactivateActiveItem()`、`fireEvent()`。 | `component.onMouseLeave(...)` |
| `onMouseOver` | `e` | 处理 `mouseOver` 回调。 执行时会派发 `mouseenter`、`mouseover` 事件。源码涉及 `getItemFromEvent()`、`setActiveItem()`、`fireEvent()`。 | `component.onMouseOver(...)` |
| `setActiveItem` | `item` | 设置 `activeItem`。 执行时会更新 `activeItem`、`focusedItem` 状态。源码涉及 `deactivateActiveItem()`、`canActivateItem()`。 | `component.setActiveItem(...)` |
| `beforeShow` | `` | 在 `show` 前执行预处理。 执行时会保留父类默认行为、更新 `savedMaxHeight`、`maxHeight` 状态。源码涉及 `callParent()`。 | `component.beforeShow()` |
| `afterShow` | `` | 在 `show` 后执行后处理。 执行时会保留父类默认行为、更新 `maxHeight` 状态。源码涉及 `callParent()`。 | `component.afterShow()` |

## 事件

| 事件 | 说明 | 监听示例 |
| --- | --- | --- |
| `click` | 用户点击组件时触发。 源码在 `onClick()` 中通过 `fireEvent()` 触发。 | `listeners: { click: function () {} }` |
| `mouseenter` | 鼠标进入组件时触发。 源码在 `onMouseOver()` 中通过 `fireEvent()` 触发。 | `listeners: { mouseenter: function () {} }` |
| `mouseleave` | 鼠标离开组件时触发。 源码在 `onMouseLeave()` 中通过 `fireEvent()` 触发。 | `listeners: { mouseleave: function () {} }` |
| `mouseover` | 鼠标移动到组件上方时触发。 源码在 `onMouseOver()` 中通过 `fireEvent()` 触发。 | `listeners: { mouseover: function () {} }` |

Source: https://ag.879818327.xyz/ext/navigation/menu-menu/index.mdx