待被添加的panel最好通过一个函数生成,否则,remove之后,就不能再进行add操作了。
删除panel可以直接使用 Ext.getCmp('left_panel').removeAll();
也可以是:
//清空panel,即删除panel中的items。
var itemLength=bbarRightPanel.items.length;
for(var i=0;i<itemLength;i++){
var x=bbarRightPanel.items.get(0);//删除panel中的第一个控件,后面的就顶上来了。);//所以每次删除时,只需删除组件数组中的首个组件即可
var array=Ext.query("*[for='"+x.id+"']");//获取组件数组中的子组件数组
Ext.removeNode(array[0]);//删除子节点,即label节点
bbarRightPanel.remove(x,true);//删除节点
}
//这时全删除了
1.penel中item被remove后不能被再次引用:
我遇到的一种问题是,我有2个panel,panel1为主面板,panel2为panel1的子面板,即panel2在panel1的items集合 中,在我的应用中,我需要动态切换panel1的items中的内容,我采用的是panel面板的方法panel1.remove(panel2),但是 这样操作之后再次调用add(panel2)的话会报extjs的错误,一旦panel2被remove后,它会调用panel2的destory方法进 行销毁,导致下次没办法再调用之前的panel2,而新创建的panel2又不符合要求(没有了之前的状态数据),解决办法如下,code:
采用这两句之后,panel2会被从panel1中移除,但又不会被销毁,那么下次还可以通过panel1.add(panel2)把panel2再加进来进行重复使用。
2.borderlayout布局中中不能动态替换组件:
呵呵,如果你的主面板的布局是borderlayout,那你不要指望能动态替换主面板的儿子级组件,因为ExtJs的官方文档里明确说了不支持对 borderlayout类型的面板的组件进行动态替换,而且我也尝试了很多次都不成功,但是我们可以换个思路,去动态替换孙子级组件,我们看代码:
如果我们直接去替换mainPanel这个面板,明显是不成功的,但是我们可以将mainPanel固定,设置它本身的布局类型为fit类型,然后 去动态替换它的子面板,这样操作是没有问题的,也就是上面讲的borderlayout你不要去替换儿子级组件,而是去替换他的孙子级组件。
还有一点,如果存在多层嵌套的面板(上中下三层)要进行动态替换的时候,最好将面板类型设置为Ext.Container类型,因为如果设置成Ext.Panel类型的话,在IE8及以下版本的IE浏览器中存在兼容性问题,add/remove方法可能会不成功。
链接:http://blog.csdn.net/hxyfendou/article/details/8772337。。。
http://www.cnblogs.com/chillsrc/archive/2012/04/12/2443818.html