Sencha Touch：删除一个项目，然后更新方向更改等视图

Question

感谢您的答复，看起来像我们可能会得到的地方。我创建了一个简单而且简单的新视图。请看下图：

var homePanelTop = new Ext.Panel({ id:'topCont', 
     cls:'topCont'  
    }); 
    var homePanelBtm = new Ext.Panel({ 
     id:'btmCont', 
     cls:'btmCont' 
    }); 


    App.views.HomeIndex = Ext.extend(Ext.Panel, { 
      id:'mainlayout', 
      fullscreen : true, 
      layout: { 
         type: 'vbox', 
         align: 'stretch', 
       }, 
       defaults:{flex:1}, 
      items: [homePanelTop, homePanelBtm], 
      suspendLayout: true, 
       monitorOrientation: true, 
       orientationchange: this.onOrientationChange, 
       onOrientationChange: function(orientation, w, h){ 
        this.suspendLayout = false; 
        if(orientation === 'portrait'){ 
          console.log('P: ' + orientation); 
           this.add(homePanelTop, true); 
          } else { 
          console.log('L: ' + orientation); 
           this.remove(homePanelTop, false); 
         } 
         this.doLayout(); 
       } 
    }); 
    Ext.reg('HomeIndex', App.views.HomeIndex); 

我希望看到上述观点是在第一负载和肖像，会出现两个面板，顶部面板（黄色）和底部面板（蓝色）。当我正常旋转时，我仍然可以得到相同的效果。

但我后来的是，当我旋转到风景顶部面板（黄色）被删除和底部面板（蓝色）填补空间的其余部分。

然后，当我转回肖像，我得到两个面板恢复到其设计尺寸（柔性：1）

请告诉我使用以上（在Chrome测试）的代码发生的是，顶部面板（黄色）保持在顶部，但在高度略小，不会消失像它应该

反正看到我有两个控制台trace命令和这些展示在旋转以下读数：

第一负载后，我再旋转到景观和输出是：

L：景观

L：景观

试图除去不存在的成分。 Ext.Container：删除需要删除组件的参数。 cmp.remove（）的用法不正确。

L：风景

试图移除不存在的组件。 Ext.Container：删除需要删除组件的参数。 cmp.remove（）的用法不正确。

L：风景

试图移除不存在的组件。 Ext.Container：删除需要删除组件的参数。 cmp.remove（）的用法不正确。

的时候我转回肖像我得到以下输出：

L：景观

试图除去不存在的组件。 Ext.Container：删除需要删除组件的参数。 cmp.remove（）的用法不正确。

L：风景

试图移除不存在的组件。 Ext.Container：删除要删除的组件的参数 。 cmp.remove（）的用法不正确。

，P：肖像

，P：肖像

所以它实际上是一些如何打响onorientationchange功能4倍lanscape旋转看着这个，第一个是确定其他三个有错误因为第一个已经移除它，所以我相信警告是什么。

然后与肖像的人，我得到两个注册为lanscape调用，然后两个命中注册肖像调用。

所有这一切只有一个动作，所以这是不知何故导致删除和添加代码不能像预测的那样工作，以及如何防止在旋转时被调用四次方向？

如果任何人有随时加入。

感谢您的帮助迄今 硅

Answer 1

很多年后...更多像我上的这种发展的想法，磕磕绊绊在此寻找帮助。

两件事。

1）消息“尝试删除不存在的组件”仅在ExtJS库的“开发”版本中找到，我不知道它是问题的可靠指示器。

2）如果你可以升级到ExtJS 4.1x。它会让你获得更好的调试工具。我特别想到'Ext JS Page Analyzer'。这将帮助您了解布局引擎正在做什么以及您希望它正在做什么。

参见：http://www.sencha.com/blog/optimizing-ext-js-4-1-based-applications