extjs - 通过 id 或 itemId 获取 TabPanel 的 Tab

Question

我的 View 中有一个带有选项卡的 TabPanel。如何获取此 Panel 中的 Tab 实例以及应设置 id 或 itemId 的属性？

谢谢

openProjectMetaTab: function(project) {
    var tabPanel = this.getTab();
    console.log(tabPanel);
    var mpItemId = 'project-metaTab-' + project.get('id')
    console.log('#'+mpItemId);
    var metaPanel = tabPanel.getComponent(mpItemId);
    console.log(metaPanel);
    if(!metaPanel) {
        tabPanel.add({
            title: project.get('title'),
            closable: true,
            items: [
                {
                    xtype: 'projectMetaForm',
                    itemId: mpItemId,
                },
            ],
        }).show();
    }
}

Answer 1

我建议使用 itemId，因为这样您就不必担心全局 id 属性冲突。根据文档:

“由于 itemId 是容器内部 MixedCollection 的索引，因此 itemId 的范围仅限于容器”

然后您可以使用 Ext.container.Container.getComponent 获取标签。

这是海报更新问题的示例:

openProjectMetaTab: function(project) {
    var tabPanel = this.getTab();
    console.log(tabPanel);
    var mpItemId = 'project-metaTab-' + project.get('id')
    console.log('#'+mpItemId);
    var metaPanel = tabPanel.getComponent(mpItemId);
    console.log(metaPanel);
    if(!metaPanel) {
        tabPanel.add({
            title: project.get('title'),
            closable: true,
            xtype: 'projectMetaForm',
            itemId: mpItemId
        }).show();
    }
}