Question

Ext.define('CCCC.view.Header', {
extend: 'Ext.toolbar.Toolbar',
requires: ['CCCC.view.header.MasterLogo',
            'Ext.button.Button'],
alias: 'widget.mainheader',
itemId : 'header',
width: '100%',
height: 100,
renderTo: document.body,




initComponent: function() {
    var me = this;
    me.items = [

        {
            xtype: 'tbfill' 
        },
        {
            xtype: 'tbseparator'
        },
        {
            xtype: 'button',
            text: 'Logout',
            itemId: 'logout',
            listeners: {
               handler: function() {
                    var me = button.up('WidgetName');
                    me.fireEvent('logoutClicked', button, e);
                    Ext.log('logout clicked');
               }
            }
        },

我已将注销按钮添加到工具栏中作为xtype。它显示为标签，无法点击＆＃34;注销＆＃34;按钮。请让我知道为什么＆＃34;退出＆＃34;按钮不可点击？

Answer 1

handler应位于按钮配置中，而不是按钮的listener配置中：

{
    xtype: 'button',
    text: 'Logout',
    itemId: 'logout',
    handler: function() {
        var me = button.up('WidgetName');
        me.fireEvent('logoutClicked', button, e);
        Ext.log('logout clicked');
    }
}

或者，如果您想使用监听器，则应该听取click事件：

{
    xtype: 'button',
    text: 'Logout',
    itemId: 'logout',
    listeners: {
        click: function() {
            var me = button.up('WidgetName');
            me.fireEvent('logoutClicked', button, e);
            Ext.log('logout clicked');
        }
    }
}

添加到工具栏的按钮在Extjs 4.2中不起作用

1 个答案: