组件查询以匹配ExtJS 4.x控制器中的上下文菜单项

我是ExtJS新手，我有一个树面板，我在其中添加了上下文菜单。我的树面板和关联菜单的定义如下：

Ext.define('UserMgmt.view.rightContainer', {
    extend: 'Ext.container.Container',
    alias: 'widget.rightcontainer',

    initComponent: function() {
        var me = this;

        // context menu for TreePanel
        var contextMenu = new Ext.menu.Menu({
            itemId: 'contextMenuForTreePanel',
            items: [
                {
                    text: 'Expand all',
                    itemId: 'expandAllNodes'
                },
                {
                    text: 'Collapse all',
                    itemId: 'collapseAllNodes'
                }
            ]
        });

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'treepanel',
                    itemId: 'myTreePanel',
                    columns: [
                        {
                            xtype: 'treecolumn',
                            dataIndex: 'name',
                        },
                        {
                            xtype: 'gridcolumn',
                            dataIndex: 'permission',
                        }
                    ],
                    listeners: {
                        itemcontextmenu : {
                            fn: function(view, record, item, index, event) {
                                console.log("Right-clicked on " + record.get('name'));
                                contextMenu.showAt(event.getXY());
                                event.stopEvent();
                            }
                        }
                    }
                }
            ]
        });

        me.callParent(arguments);
    }
});

init: function() {
    this.control({
        'combobox#myComboBox': {
            select: this.onComboBoxSelect
        },
        'treepanel#myTreePanel': {
            itemclick: this.onTreePanelItemClick
        }
    });
}

这正是我所期望的。当我右键单击树节点时，我看到上下文菜单弹出“全部展开”和“全部折叠”菜单项。我遇到的问题是在控制器中为上下文菜单项连接事件处理程序

在我的控制器中，我一直在连接事件处理程序，如下所示：

Ext.define('UserMgmt.view.rightContainer', {
    extend: 'Ext.container.Container',
    alias: 'widget.rightcontainer',

    initComponent: function() {
        var me = this;

        // context menu for TreePanel
        var contextMenu = new Ext.menu.Menu({
            itemId: 'contextMenuForTreePanel',
            items: [
                {
                    text: 'Expand all',
                    itemId: 'expandAllNodes'
                },
                {
                    text: 'Collapse all',
                    itemId: 'collapseAllNodes'
                }
            ]
        });

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'treepanel',
                    itemId: 'myTreePanel',
                    columns: [
                        {
                            xtype: 'treecolumn',
                            dataIndex: 'name',
                        },
                        {
                            xtype: 'gridcolumn',
                            dataIndex: 'permission',
                        }
                    ],
                    listeners: {
                        itemcontextmenu : {
                            fn: function(view, record, item, index, event) {
                                console.log("Right-clicked on " + record.get('name'));
                                contextMenu.showAt(event.getXY());
                                event.stopEvent();
                            }
                        }
                    }
                }
            ]
        });

        me.callParent(arguments);
    }
});

init: function() {
    this.control({
        'combobox#myComboBox': {
            select: this.onComboBoxSelect
        },
        'treepanel#myTreePanel': {
            itemclick: this.onTreePanelItemClick
        }
    });
}

这些事件处理程序工作正常。不幸的是，我似乎无法找到一个组件查询来匹配我的上下文菜单项，这样我就可以为它们连接一个单击事件处理程序。我原以为会是这样的：

contextMenuForTreePanel#expandAllNodes

或

---

然而，这两种方法似乎都不能正常工作。谁能告诉我我做错了什么？谢谢

上下文菜单不是树面板的子项。尽管如此，当您为其分配itemId时，您可以使用

#contextMenuForTreePanel

再添加一条注释：不要使用

新建

操作符，而是使用

Ext.create

。