ExtJS的可更换项目

Question

我想创建这样

Ext.onReady(function() { 

    Ext.QuickTips.init(); 

    Ext.create('Ext.Viewport', { 
     layout: 'fit', 
     id: 'cmpWithReplacebleItems' 
    }); 

    Ext.getCmp('cmpWithReplacebleItems').items = [new SomeComponent()]; 
}); 

SomeComponent

SomeComponent = Ext.extend(Ext.Viewport, { 
    layout: 'fit', 
    items: [{ 
      xtype: 'panel', 
      html: 'test', 
      title: 'My Panel' 
     }] 
}); 

的代码的东西你可以看到，我想 'cmpWithReplacebleItems' 项目是replaceble。但是，当我尝试此代码时，我调整大小时出现一些错误...

问题是..什么是正确的方法来做到这一点？

Answer 1

构建组件后，不能直接修改这些项目。您想要使用Ext.Container方法add，remove或removeAll修改项目。

Ext.onReady(function() { 

    Ext.QuickTips.init(); 

    Ext.create('Ext.Viewport', { 
     layout: 'fit', 
     id: 'cmpWithReplacebleItems' 
    }); 

    var cmp = Ext.getCmp('cmpWithReplacebleItems'); 
    cmp.add(new SomeComponent()); 
    cmp.doLayout(); //important to layout again after adding/removing 
});