Добавление панели сетки к первой вкладке панели вкладок

Question

У меня есть GRID, который работает правильно. Теперь мне нужно добавить этот GRID в первую панель вкладок. Как я могу это сделать?

мой код:

GRID.JS

Ext.create('Ext.grid.Panel', { 
    xtype:'grid', 
    title: 'Simpsons', 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    columns: [ 
     { header: 'Name', dataIndex: 'name' }, 
     { header: 'Email', dataIndex: 'email', flex: 1 }, 
     { header: 'Phone', dataIndex: 'phone' } 
    ], 
    height: 200, 
    width: 400, 
    renderTo: Ext.getBody() 
}); 

TAB.JS

Ext.create('Ext.tab.Panel', { 
    width: 300, 
    height: 200, 
    activeTab: 0, 
    items: [ 
     { 
      title: 'Tab 1', 
      xtype:'grid' 
     }, 
     { 
      title: 'Tab 2', 
      html : 'Another one' 
     } 
    ], 
    renderTo : Ext.getBody() 
}); 

Я добавил xtype:grid в GRID.JS, и я пытаюсь получить доступ к этой сетки из TAB .JS на первой вкладке, но она не отображается.

Answer 1

xtype: 'grid' - средства create standard Ext.grid.Panel and add it here.

У вас есть два варианта:

Создать свою сетку и сохранить его в переменный.

var _grid = Ext.create('...', {...}); 

Ext.create('Ext.tab.Panel', { 
    ... 
    items: [ 
     _grid 
    ] 
}); 

Или определить свой собственный класс с новым xtype

Ext.define('MyGrid', { 
    extend: 'Ext.grid.Panel', 
    alias: 'widget.mygrid', 
    ... 

}); 

Ext.create('Ext.tab.Panel', { 
    ... 
    items: [{ 
     xtype: 'mygrid' 
    }] 
});