Extjs 4，如何在工具栏中自动隐藏菜单？答案

【问题标题】：Extjs 4, How to autoHide menu in the toolbar?Extjs 4，如何在工具栏中自动隐藏菜单？
【发布时间】：2012-02-13 19:34:08
【问题描述】：

当我点击工具栏上的按钮时，菜单打开并保持打开状态。

所以我需要点击关闭来隐藏下拉菜单框。这不是我所期望的。

有人知道如何自动隐藏工具栏菜单吗？

这是我的代码：

{
    xtype: 'toolbar',
    itemId : 'mainMenu',
    items: [
    {
        text : 'Main Menu 1',
        menu : {
        xtype: 'menu',
        items : [
            {
            xtype: 'button',
            text: 'Contacts',
            itemId : 'extjs'
            },{
            xtype: 'button',
            text: 'Orders',
            itemId: 'extjs2'
            }
        ]
        }
    },{
        text : 'Main Menu 2',
        xtype : 'button',
        itemId : 'extjs3'
    }
    ]
}

【问题讨论】：

标签： extjs menu extjs4 toolbar

【解决方案1】：

这是默认的菜单行为。菜单会一直存在，直到它被任何关闭点击停用。如果您想更改该行为，可以在菜单上添加鼠标离开事件的侦听器并在此时隐藏菜单。这是您需要的侦听器：

listeners:{
    'mouseleave': function( menu, e, eOpts){
          console.log('bye bye ');
          menu.hide();
      }
 }

【讨论】：