View Full Version : items is undefined during different component initialization

8 Feb 2012, 3:51 PM

In 4.0.7 I was able to add child components in initComponent function. For example for Tab Panel

Now with 4.1 it gives me 'items is undefined' error in getRefItems() function of AbstractContainer when I do not specify items in the config init and trying to add it in initComponent function for this TabPanel. Any suggestions?


Ext.create('Ext.tab.Panel', {
width: 400,
height: 400,
renderTo: document.body,
initComponent: function() {
this.items = [{ title: 'Foo'
}, {
title: 'Bar',
tabConfig: {
title: 'Custom Title',
tooltip: 'A button tooltip'


8 Feb 2012, 4:09 PM
You really shouldn't be overriding a method inline like that, what's the reasoning for doing so?

8 Feb 2012, 4:20 PM
it was my understanding that using initcomponent is a safe approach if I would like initialize something before instanriate. or I can do it only for define?

11 Feb 2012, 9:50 PM
Overriding initComponent in an Ext.define is fine, just not in Ext.create.

Generally, overriding a method in an Ext.create is bad practice but occasionally it is very convenient. If you do it directly (the way you have in your example) then callParent won't work correctly, or at least not reliably. 4.1 introduces a concept called xhooks to solve this problem. Take a look at Don's SenchaCon video for more info on this.