{
region:'south',
height:400,
items:{
id :"addpanelId",
height:400,
items:[{xtype:'button',text:'添加组件',handler:addPanel},
{xtype:'button',text:'移除组件',handler:removePanel}]
}
}
2. 上述代码中,尽量不要将函数直接写成handler:function(){}模式,这样会导致,有些变量访问不了,最好在公共变量处定义一个函数 function addPanel(){}
3.add()方法执行之后,需要dolayout一下,注意不要使用doLayout(true,true),直接使用doLayout()就行,否则会使得添加进入的panel上的控件不可见。
4.待被添加的panel最好通过一个函数生成,否则,remove之后,就不能再进行add操作了。
-------------------------------------------------------------------------------
下面是全部可运行的代码
-------------------------------------------------------------------------------
function createPanel (){ //创建一个panel
var mymappanel2012A = new Ext.Panel({
frame:true,
height:200,
id:'mappanel2012A',
items:{xtype:'field',id:'maxlieId1212'}
});
return mymappanel2012A;
}
function removePanel(){//移除一个组件面板
try{
var xxmap = Ext.getCmp('addpanelId');
var myt = Ext.getCmp('mappanel2012A');
if(myt){
Ext.getCmp('addpanelId').remove(myt);
}
Ext.getCmp('addpanelId').doLayout();
}catch(e){
alert(e.name + " " + e.message);
}
}
function addPanel(){ //添加一个组件面板
try{
Ext.getCmp('addpanelId').add(createPanel ());
Ext.getCmp('addpanelId').doLayout();
}catch(e){
alert(e.name + " -- " + e.message);
}
//Ext.getCmp('addpanelId').doLayout(true,true);//这个方法会导致面板下的组件无法显示
}