Extjs 4 - 按钮菜单项单击

Question

我有一个按钮menu，而按钮又设置为容器的tools。我想处理单击菜单项而不是按钮本身。我该如何实现它？

Answer 1

您可以通过下面的代码处理侦听器中的所有项目。将菜单配置传递给按钮，并在菜单中添加单击监听器。

{
    xtype: 'button',
    text: 'Button',
    menu: {
        xtype: 'menu',
        items: [
            { text: 'foo' },
            { text: 'bar' },
            { text: 'hoge' }
        ],
        listeners: {
            click: function( menu, item, e, eOpts ) {
                console.log(item.text);
            }
        }
    }
}

Answer 2

示例，应该是直截了当的：

Ext.onReady(function() {

    new Ext.panel.Panel({
        renderTo: document.body,
        title: 'A Panel',
        width: 200,
        height: 200,
        tools: [{
            xtype: 'button',
            text: 'Foo',
            menu: {
                items: [{
                    text: 'Item 1',
                    handler: function() {
                        console.log('Item 1');
                    }
                }, {
                    text: 'Item 2',
                    handler: function() {
                        console.log('Item 2');
                    }
                }]
            }
        }]
    });
});