Sencha：如何在以编程方式删除面板上的组件后刷新Android屏幕

Question

我正在Android上开发sencha应用程序（sencha touch 2.3.1）。 在屏幕上，用户可以添加＆＃39;设备节点进入列表或“删除”＃39;新创建的设备节点。 用户按下“完成”后按钮，我将从列表中收集所有设备信息 它可以顺利添加新的设备节点。 但是当我删除设备节点到最后一个节点时，虽然它实际上从DOM中删除了所有设备节点，但我仍然在屏幕上看到它们的图像。 仅在旋转屏幕时才会删除这些虚拟图像。 因此我认为问题是我的手机屏幕还没有刷新。 我搜索了几个小时的主题，有些人谈论了doLayout（），但是在sencha 2.3.1中没有这样的API可供使用。 那么，如何使用sencha touch 2.3.1刷新屏幕？或者如何完全删除设备节点的虚拟图片

我在View容器中的代码：newSettingView.js

var itemNum = 1;
Ext.define('MyApp.view.newSettingView', {
    extend: 'Ext.Container',
    xtype: 'settingViewType',     //define xtype='settingView'
    requires: [
        'Ext.Toolbar',
        'Ext.Button'
    ],
    config: {
        layout: 'fit'
    },
    initialize: function() {                //called everytime class is instanced
        this.callParent(arguments);         //must be there for sencha to work
    },
    show: function(){
        var backBtn = {xtype:'button', text:'Back', 
                                       ui:'back',handler:this.onBackBtnTap,scope:this};
        var topToolbar = {xtype:'toolbar', docked:'top', items:[backBtn]};   
        var infoContainer = {xtype:'panel',id:'devList'}; 

        var addBtn = {xtype:'button', text:'Add',width:'30%', 
                                  ui:'action',handler:this.onAddBtnTap,scope:this};  
        var doneBtn = {xtype:'button', text:'Done', width:'30%',
                                  ui:'action',handler:this.onDoneBtnTap,scope:this};     
        var cancelBtn = {xtype:'button', text:'Cancel', width:'30%', 
                                 ui:'action',handler:this.onCancelBtnTap,scope:this}; 
        var bottomToolbar = {xtype:'toolbar', docked:'bottom', 
                items:[doneBtn,{xtype:'spacer'},cancelBtn,{xtype:'spacer'},addBtn]}; 

        var containerView = {xtype:'panel', items:[topToolbar,
                                  {xtype:'label',padding:10,html:'Device list:'},
                                  {layout:'vbox',scrollable:'vertical',height:'100%', 
                                    width:'100%',xtype:'panel',border:4,
                                    style: 'border-color: blue; border-style: solid;',
                                    items:[infoContainer]},
                                  bottomToolbar ]};
        this.add([containerView]);              
    },
    onDelBtn: function(btn) {   //'btn' = button oject
        var delField = Ext.getCmp(btn.getItemId()).up('fieldset');
        delField.removeAll(true, true);
        var temp = delField.up('panel');
        temp.remove(delField, true);
        itemNum--;

    },
    onBackBtnTap: function(){
        Ext.Viewport.setActiveItem({xtype:'main'});   //back to main screen
        itemNum = 1;
    },
    onAddBtnTap: function(){
        var newfieldSet = {xtype:'fieldset', defaultType:'textfield',id:'field'+itemNum,
                        items:[{xtype:'button',iconCls:'delete',docked:'left', 
                              width:'15%',height:'10%', 
                              handler:this.onDelBtn,scope:this, id: 'btn'+itemNum},
                              {labelWrap:true,label:'DevInfo', name:'field1', 
                                                       placeHolder:'0126xxxxxx'},
                               {labelWrap:true,label:'Name', name:'field2'}]};
        itemNum++;
        var temp = Ext.getCmp('devList');
        temp.add(newfieldSet);

    },
    onDoneBtnTap: function(btn){
    },
    onCancelBtnTap: function() {
    }
});