将网格面板添加到选项卡面板的第一个选项卡

Posted 2023-02-26

【中文标题】将网格面板添加到选项卡面板的第一个选项卡

【英文标题】：Adding a Grid Panel to the 1st tab of the Tab Panel

【发布时间】：2012-07-01 08:35:33

【问题描述】：

我有一个可以正常工作的 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()
);

我已在 GRID.JS 中添加了 xtype:grid，我试图从第一个选项卡中的 TAB.JS 访问该 Grid，但它没有显示出来。

【参考方案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'
    ]
);

【讨论】：

对不起，这是一个意外。我实际上是回到这里来看看为什么我的声誉下降了一点。除非您编辑了帖子，否则我似乎无法撤消我的反对票。 meta.stackexchange.com/questions/19940/…