我要回家想一想~

兩種方式

第一種

layout: 'column',
headerCfg: {
    tag: 'div',
    cls: 'x-panel-header',
    children: [
        {
            tag: 'div',
            cls: 'panel_header_text',
            html: 'header text'
        },
        {
            tag: 'div',
            cls: 'panel_header_icon',
            html: '<img src="images/icon.png" />'
        }
    ]
},
listeners: {
    afterrender: function(cmp) {
        cmp.header.on('click', function(e, h) {
            alert('you clicked the icon');
        }, cmp, {
            delegate: '.panel_header_icon',
            stopEvent: true
        });
    }
},

How to put text and clickable icons in a Ext.Panel header?

第二種

tbar: {
    xtype: 'toolbar',
    items: [
        {
            xtype: "displayfield",
            value: 'my title'
        },
        '->',
        {
            xtype: 'button',
            text: 'btn',
            onClick: function () {
                // do something
            }
        }
    ]
},

How can I put a dropdown in the header of an ExtJS panel?