EXT JS toLayout視口犯規說明了什麼

Question

閱讀有關添加新的組件，以現有的容器無需重新加載整個頁面我運行小的問題，同時結合樹和標籤視口組件內部大量的實例後。

我想要做的就是在單擊事件註冊樹節點，並加載到內容容器新的組件，這取決於節點類型也可以是一個tabpanel，GridPanel中或任何其他可用的組件。

這裏是樹對象的小例子：

{ 
    xtype: 'treepanel', 
    id: 'tree-panel', 
    listeners: { 
     click: function(n) { 

      var content = Ext.getCmp('content-panel'); 

      content.setTitle(n.attributes.qtip); 

      //remove all components from content-panel 
      content.removeAll(); 

      content.add(dummy_tabs2); 

      content.doLayout(); 

      return; 
     } 
    } 
} 

所有DOM操作都很好，一切正常註冊，新的標題所示，但dummy_tabs2沒有顯示。我確實嘗試設置doLayout的各種屬性（true | false，true | false），但沒有任何反應。

我做錯了什麼？

Answer 1

現在我明白了，DOM工作正常，但EXTJS將隱藏屬性應用於新插入的元素。所以剩下要做的就是將show（）函數應用到我們的新組件。下面的代碼看起來像這樣：

{ 
    xtype: 'treepanel', 
    id: 'tree-panel', 
    listeners: { 
    click: function(n) { 

    var content = Ext.getCmp('content-panel'); 

    content.setTitle(n.attributes.qtip); 

    //remove all components from content-panel 
    content.removeAll(); 

    var container = content.add(dummy_tabs2); 

    content.doLayout(); 

    container.show(); 

    return; 
    } 
}} 

Answer 2

嘗試在doLayout之前設置dummy_tabs2的寬度和高度。 檢查螢火蟲，也許面板在那裏，但你看不到。

閱讀Ext.Panel在API。

當任一指定的 子項的面板，或者動態地添加 組件添加到面板，請記住 考慮如何希望該小組 安排這些子元素和 這些子元素是否需要 使用Ext的內置 佈局方案之一進行尺寸調整。默認情況下，面板使用ContainerLayout方案 。這 只是呈現的子組件， 追加他們的集裝箱內的其他 後一個，並且不 適用任何大小的。

希望這會有所幫助。