Modifying items in initComponent()

Question

I create some items in initComponent() Problem is, this.items somehow referes to the class variable, not to the instance variable.

So when I make two instances, I end up with two buttons.

items: [],
initComponent: function() {
  this.items.push( { xtype: 'button', ... }) ;
  this.callParent( arguments );
}

Since I have to use push, every time new elements get pushed in.

Is there some instance equivalent to this.items where I can modify the definition before the button gets created or do I have to check for duplicates manually?

Answer 1

You shouldn't return this.callParent( arguments );

Just this is enough:

initComponent: function() {
    var me = this;
    me.items = { xtype: 'button', ... }; //Are you sure items is filled up here?
    me.callParent();
}

Also if you're writing your own 'component' and you want to pass parameters in the Ext.create I always do the following:

constructor: function (config) {
    var me = this;
    Ext.apply(me, config); 
    me.callParent();
}

This will overwrite your items declaration in your class with the one you hand in the Ext.create()

Answer 2

You could overload the constructor and tweak the config in there:

constructor: function(config)
{
  config.items.someButton = { xtype: 'button', ... };
  this.callParent([config]);
}