IE中panel不正常顯示

 

寫道

當某個組件調用 add( Ext.Component/Object component ) : Ext.Component
即往組件裏添加Component時，必須調用doLayout()方法，更新佈局，才能看的見剛加入的組件。

 

problems：

在Ext一個系統開發中，用card佈局實現了一個Mpanel，panel中繼續加入items:panel， panel，再在子panel中繼續加入items:Formpanel,然後再Formpanel中加入items： field， field，field...。（以上子組件都是在創建Mpanel的時候加入的，不是採用動態載入）。採用setActiveItem()實現不同panel之間切換，在IE中切換panel時，FormPanel無法正常顯示。fireFox中正常顯示。

 

 分析：

在IE中需要在setActiveItem（）後，調用doLayout()，FormPanel才能正常顯示。

 

setActiveItem : function(item){
        item = this.container.getComponent(item);
        if(this.activeItem != item){
            if(this.activeItem){
                this.activeItem.hide();
            }
            this.activeItem = item;
            item.show();
            this.layout();
        }
    },

 

setActiveItem（），注意其中的this.layout（），僅設置了對當前組件的l界面進行重新佈局。

 

doLayout : function(shallow){
        if(this.rendered && this.layout){
            this.layout.layout();
        }
        if(shallow !== false && this.items){
            var cs = this.items.items;
            for(var i = 0, len = cs.length; i < len; i++) {
                var c  = cs[i];
                if(c.doLayout){
                    c.doLayout();
                }
            }
        }
    }

 doLayout（）， 對當前組件及組件中的各個子組件進行重新佈局。

 

由於card佈局中的子panel中包含幾層的items，這些組件都無法被渲染。

 

至於firefox中爲什麼能顯示出來，I don’t know。