关于Ext.extend的困惑

code can run:
[code="java"]
var MyPanel = Ext.extend(Ext.Panel, {
buttons : [{
text : 'button',
handler : Ext.emptyFn()
}],
initComponent : function() {
Ext.apply(this, {
items : [new Ext.Panel()]
});
MyPanel.superclass.initComponent.apply(this, arguments);
}
});
Ext.reg('MyPanel', MyPanel);
[/code]
code error:
[code="java"]
var MyPanel = Ext.extend(Ext.Panel, {
buttons : [{
text : 'button',
handler : Ext.emptyFn()
}],
items : [new Ext.Panel()],
initComponent : function() {
Ext.apply(this, {});
MyPanel.superclass.initComponent.apply(this, arguments);
}
});
Ext.reg('MyPanel', MyPanel);
[/code]
create an instance of MyPanel
[code="java"]
Ext.onReady(function() {
var myPanelA = new MyPanel({
title : 'Panel A'
});

        myPanelA.render(Ext.getBody());
    })

[/code]

我的问题是items这个选项一定要在initComponent里配置吗?为什么?非常感谢

3个回答

看了下Ext.Container-items的源码.
[code="javascript"]
// private
initComponent : function(){
Ext.Container.superclass.initComponent.call(this);

...

/**

  • The collection of components in this container as a {@link Ext.util.MixedCollection}
  • @type MixedCollection
  • @property items
    */
    var items = this.items;
    if(items){
    delete this.items;
    if(Ext.isArray(items) && items.length > 0){
    this.add.apply(this, items);
    }else{
    //报错的地方
    this.add(items);
    }
    }
    },

    // private 应该是因为这句还没执行
    initItems : function(){
    if(!this.items){
    this.items = new Ext.util.MixedCollection(false, this.getComponentId);
    this.getLayout(); // initialize the layout
    }
    },
    // private
    setLayout : function(layout){
    if(this.layout && this.layout != layout){
    this.layout.setContainer(null);
    }
    //直到这里才执行
    this.initItems();
    this.layout = layout;
    layout.setContainer(this);
    }

[/code]

你放在外面的话,多个MyPanel实例是用一个items : [new Ext.Panel()], 的吧

所以要不你就修改人家的源码,要不你就按那种方式写.

立即提问
相关内容推荐