7

我遇到了一个我想非常重要的问题。在一个简单的 Sencha Touch App 中，我有很多视图。我的 Mainview 是一个 TabPanel，底部有停靠图标。有时在我的应用程序中，我切换到 Tabpanel 之外的另一个视图。我不希望 DOM 因视图而过载，我不再需要，所以我正在寻找一种解决方案来在视图不活动时销毁视图。我试过这个，同时在我的控制器中切换到另一个视图：

this.getMainview().destroy();

似乎 Mainview 被删除了，但出现错误：

Uncaught TypeError: Cannot read property 'dom' of null

所以我猜 .destroy() - 方法有问题还是有更好的方法来处理这个问题？

4

3 回答 3

6

在移动到新视图之前，您可以调用下面的代码来删除当前视图

Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true);

或者您也可以提供项目对象而不是 ActiveItem

于 2012-05-11T09:53:20.203 回答
5

我以前多次被这个问题困扰过。目前看来，Sencha Touch 2 中并没有高效且真正无bug 的解决方案。当第二次再次添加视图时，该令人不快的错误将再次出现。

一个可能的解决方案：

此代码片段：

your_container(your_container.getActiveItem(), false);

实际上不会从内存中销毁您的子组件，而是从 DOM 中销毁。稍后当你添加它时，不会有错误（正如我测试过的那样）。

希望能帮助到你。

于 2012-05-12T10:08:39.743 回答
0

我将公开我的情况以及我是如何解决的。

我有一个带有图标的 TabPanel。这些选项卡之一显示项目列表。当您单击一个项目时，您将被带到一个显示其描述的新面板。如果单击后退按钮，则该面板将被销毁并返回到列表。这样你就破坏了现在未使用的“描述”面板。

所以我所做的是创建一个函数来根据单击的项目的索引来实例化描述面板：

function project(i) {
    var v;
    switch(i) {
        case 0:
            v = Ext.create( 'Ext.Panel', {
                title: 'title',
                layout: { type: 'fit' },
                id: 'project0',
                iconCls: '',
                style: '',
                html: 'my html'
                });
            break;
    }
    return v;
}

现在，在列表的“itemtap”事件中，我有这个：

var lastItem = container.add(project(i));
itemsList.hide(); //hide the List and display only the new Panel in the container

现在，我在标题中有一个按钮可以返回到上一个视图（即列表），这是该按钮的事件“点击”：

container.remove(lastItem, true); //hide and destroy it
itemList.show(); //show the List again

因此，如果我在列表和描述项（面板）之间来回切换，现在没有问题，因为每次单击它们时都会得到一个新实例，同样当我返回时它也会被破坏。

这解决了我的问题。

于 2012-12-07T17:22:59.737 回答