extjs initComponent does not work for Grid

Question

My Grid was working perfectly before, and I decided to add an initComponent method so I can do my own initialisation.

All I did was add an initComponent function to my class as below with an alert() message.

The alert pops up, and then I get this error message :

Cannot read property 'applyColumnsState' of undefined

Ext.define('js.grid.PackageGrid', {

    referenceToToolbar: this.toolbar,

    extend: 'Ext.grid.Panel',

    title: '',
    xtype: 'array-grid',
    collapsible: true,
    multiSelect: true,
    store: tablestore,
    autoExpandColumn: 'name',
    columns: createColumns(),
    loadMask: true,
    stateful: true,
    stateId: 'packageGrid',

    filterable: true,

    viewConfig: {
        stripeRows: true,
        enableTextSelection: true
    },

    initComponent : function (){
         alert('hi')
    },
}

What do I need to fulfill so that the initComponent method does not throw this error?

Answer 1

You have to call parent method in your initComponent override to finish component initialization correctly.

So your initComponent method should look like this:

initComponent : function (){
     alert('hi')

     this.callParent();
},