Динамическое создание колонок в гриде
 

Взял за основу пример из сайта ExtJS. Немного его модифицировав, что бы показать проблему.
Стоит задача, определять колонки в функции initComponent.
При этом, если запустить, получаю ошибку

TypeError: Cannot call method 'insert' of undefined

Подскажите, что делаю не так? И может это можно другим путем решить?

Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['name', 'email', 'phone'],
    data:{'items':[
        {'name': 'Lisa',  "email":"lisa@simpsons.com",  "phone":"555-111-1224"},
        {'name': 'Bart',  "email":"bart@simpsons.com",  "phone":"555-222-1234"},
        {'name': 'Homer', "email":"home@simpsons.com",  "phone":"555-222-1244"},
        {'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254"}
    ]},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    initComponent: function() {
      this.columns = [
          {text: 'Name',  dataIndex: 'name'},
          {text: 'Email', dataIndex: 'email', flex: 1},
          {text: 'Phone', dataIndex: 'phone'}
      ];
      this.callParent(arguments);
    },
    store: 'simpsonsStore',
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

Кстати, проблема возникает даже при вот таком коде

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    initComponent: function() {
      this.callParent(arguments);
    },
    columns: [
        {text: 'Name',  dataIndex: 'name'},
        {text: 'Email', dataIndex: 'email', flex: 1},
        {text: 'Phone', dataIndex: 'phone'}
    ]
    store: 'simpsonsStore',
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

т.е как только появляется метод initComponent и все - ошибка.

Выкрутился таким путем

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    columns: {
        get items() {
            return [
               {text: 'Name',  dataIndex: 'name'},
               {text: 'Email', dataIndex: 'email', flex: 1},
               {text: 'Phone', dataIndex: 'phone'}
            ];
        }
    }.items,
    store: 'simpsonsStore',
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

Для чего все это надо было. В некоторых случаях идет динамическое создание грида на сервере.
Но так как возвращается к нам JSON то надо было где-то сделать динамическое создание колонок итд.
Оп идее это должно работать в initComponent, а не работало.

Спасибо за хорошую ссылку!