我有一个嵌套的面板,如:
Ext.define('Demo.view.example', {
extend: 'Ext.panel.Panel',
requires:[
'Ext.toolbar.Paging'
],
xtype: 'demo-view-example',
autoScroll: true,
layout: {
type: 'vbox',
pack: 'start',
align: 'stretch'
},
frame: true,
initComponent: function() {
Id = this.Id;
var store = Ext.create('Demo.store.example');
store.proxy.url = store.proxy.url + this.Id;
Ext.apply(this, {
store: store
});
this.items = [],
this.bbar = Ext.create('Ext.PagingToolbar', {
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display",
listeners: {
beforechange: function(obj){
obj.up().removeAll();//to remove its children also
}
}
}),
this.callParent();
},
listeners: {
afterrender: function(obj){
var panel = Ext.create('Demo.view.example1',{
});
obj.add(panel);
obj.doLayout();
}
});
在这里,我动态添加一个面板。在更改功能之前,我正在删除组件,但它不会删除子项(嵌套面板)。
示例代码1:
Ext.define('Demo.view.example1', {
extend: 'Ext.panel.Panel',
xtype: 'demo-view-example1',
autoScroll: true,
defaults: {
frame: false
},
layout: {
type: 'vbox',
pack: 'start',
align: 'stretch'
},
initComponent: function() {
this.items = [{
xtype: 'demo-view-example2',
flex:2
}];
this.callParent();
if (this.requestId) {
var requestContainerPanel = Ext.create({
xtype: 'demo-view-example3',
flex: 6
});
this.add(requestContainerPanel);
}
this.doLayout();
}
});
在这里,我将添加一个静态视图(example3)和动态视图(example4),两者都从Ext.panel.Panel扩展
问题: 在视图中(示例)在更改函数之前,我正在删除组件,但它只删除了示例的obj。我想删除所有视图(例如,example1,example2,example3)。我应该怎么做。