如果在動態添加標籤的情況下在標籤面板中訂購標籤？

Question

我有一個tabpanel在我看來只有一個選項卡。稍後當其他數據加載時，我會將這些標籤添加到此tabpanel，但是標籤以我添加的順序呈現。我想在現有的標籤之前顯示新的標籤，但它總是追加標籤，有沒有辦法像addBefore使用我可以控制標籤的位置？

這是我的一個tabpanel：

{ 
    xtype   : 'tabpanel', 
    flex   : 1, 
    id   : 'featurePanel', 
    tabBarPosition : 'top', 
    height   : '100%', 
    ui    : 'maintabbar', 
    tabBar   : { 
     layout : { 
      pack : 'center' 
     } 
    }, 
    items : [{ 
     title : 'Tab 1', 
     items : [{ 
      xtype : 'panel', 
      id : 'tab1Id' 
     }] 
    }] 
} 

這裏是我正在增加新的面板：

var featureList = Ext.create('MyTabApp.view.FeaturedList', { 
     id  : "tab2Id" 
    }); 
    var featurePanel = Ext.getCmp("featurePanel"); 
    featurePanel.add({ 
     title : 'Tab 2', 
     items : [{ 
      xtype : 'panel', 
      items : [featureList] 
     }] 
    }); 

我想這個新的選項卡（表2），前 '選項卡1' 的出現。

Answer 1

tabpanel的添加方法將始終在最後添加新選項卡。因此，如果您想在某個不同的位置添加新標籤，則必須使用insert方法。使用此方法，您可以設置添加新選項卡的位置。

與您的代碼可以像 -

var featureList = Ext.create('MyTabApp.view.FeaturedList', { 
    id  : "tab2Id" 
}); 
var featurePanel = Ext.getCmp("featurePanel"); 
featurePanel.insert(0,{ 
    title : 'Tab 2', 
    items : [{ 
     xtype : 'panel', 
     items : [featureList] 
    }] 
}); 

這將在第一位置添加新的選項卡。如果要添加多個選項卡，則可以設置計數器並相應地添加新選項卡。