通过extjs.apply更改配置的不同行为

时间:2012-04-30 02:19:34

标签: extjs

Ext.define('extjs.example.mypanel',{
    extend:'Ext.panel.Panel',
    layout: {
        type: 'vbox',
        align : 'stretch',
        pack  : 'start',
     },
    initComponent: function(config) {
        Ext.apply(this.subpanel,{
        html:'panel changed',
        listeners:{
                click: function(){alert('hi');},
                element: 'body'
        }
    } 
        );
        Ext.apply(this,{
            items: [
                this.subpanel,
                {html:'panel 2', height:150},
                {html:'panel 3', height:150}
            ]
        } 
        );
        this.callParent(arguments);
    },
    subpanel:Ext.create('Ext.panel.Panel',{
        html:'panel 1', 
        height:150
    })

} );

Ext.onReady(function() {
Ext.create('extjs.example.mypanel', {
    renderTo: Ext.getBody(),
    height:500,
    width: 500
});

});

这是代码。我想研究如何使用Ext.apply。在这里,我通过这种方法改变了两种配置。一个是HTML,另一个是听众。 但是我发现html改变了。但是听众没有。

我的问题是: 1)我的问题是什么?我做错了或者Ext.apply无法更改某些配置? 2)如果我做错了,怎么纠正呢? 3)如果某些配置不能使用Ext.apply?是否有关于它的规则或文件?

1 个答案:

答案 0 :(得分:0)

Ext.apply不会分配侦听器。它只是将config的所有属性复制到指定的对象。在您的示例中,this.subpanelExt.panel.Panel的实例,您可以做的是传递配置对象:

subpanel: {
    xtype: 'panel',
    html: 'panel 1',
    height: 150
}