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。