繁体   English   中英

Sencha Touch 2.1:如何创建/销毁标签内容以提高性能?

[英]Sencha Touch 2.1: How to create/destroy tab content to increase performance?

我的ViewPort中有一个带有4个标签的TabPanel。 是否可以保留标签本身(点击的“按钮”),但是如果看不见,则删除/创建内容/ dom?

我正在寻找类似tab.removeContent()和tab.createContent()的东西,我想...

我试过了:

activeitemchange: function(component, value, oldValue, eOpts) {
    Ext.Viewport.remove(oldValue, true);
}

这似乎无能为力...

这将删除所有内容:

activeitemchange: function(component, value, oldValue, eOpts) {
    Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true);
}

我得到了删除部分的工作:

oldValue.removeInnerAt(0);

但是它的“对立面”是什么,即如何设置标签的内容?

var myContent = Ext.create('MyApp.view.MyView');
// and now?

Sencha高级论坛经理Mitchell Simoens为此进行了扩展。 可以在他的github页面上找到:“ 优化”选项卡(git)

这些选项卡将被删除并缓存。

编辑:在当前情况下,您正在扩展Ux.tab.OptimizedTab ,这是错误的。 该库仅对Ext.tab.Panel某些方法进行了一些更改(该库也没有扩展Ext.tab.Panel 。在Mitchell给出的示例中,您可以看到他正在扩展Ext.tab.Panel和在Optimized optimized-tab上设置defaultType。

Ext.define('MyApp.view.Main', {
    extend : 'Ext.tab.Panel',
    xtype  : 'main',

    requires : [
        'Ext.TitleBar',
        'Ext.Video',
        'Ux.tab.OptimizedTab'
    ],

    config: {
        tabBarPosition : 'bottom',
        defaultType    : 'optimized-tab',
        items : {
            ...
        }
    }
}

请注意,您更改了lib类名,我认为这是一种缺乏尊重,并且最重要的是,您给它提供了错误的名称并将其放置在错误的文件夹中。 (您提供的名称是Crossfit.view.OptimizedTab但它根本不是视图。)

我想对您的应用程序良好架构给予一些赞赏,我还没有看到很多了解Sencha Touch架构的人。 但是你,米切尔和我是其中的一些:)

我最初在使用此组件时也遇到了问题,您会注意到这里的关键是,如果您的标签面板中有3个项目,则每个项目都必须具有xtype“ optimized-tab”,并且其中包含您的实际项目。

例如:

items: [
        {
            xtype: 'optimized-tab',
            title: 'Tab 1',
            iconCls: 'info',
            baseCls: 'myBtn',
            cls: 'myBtn',
            html: 'Tab 1',
            items: [
                {
                    xtype: 'component',
                    baseCls: 'myBtn',
                    cls: 'myBtn',
                    ui: 'light'
                }
            ]
        },

要测试它是否确实有效,请将其粘贴到控制台中以查找DOM项的数量:

document.getElementsByTagName("*").length

如果第一个选项卡为空,则应该看到大约50个项目,如果有地图,则应该为200个左右。如果优化的选项卡不起作用,则您的DOM中可能会看到大约400个项目。

如果正常,您可能会看到优化的选项卡在动画完成之前过早地删除了项目。 因此,您可以对其稍加修改以删除之后的项目。

您也可以参考此链接以获取更多信息: http : //www.sencha.com/forum/archive/index.php/t-207907.html?s=24386d2ced82d0625b8199247e0f5c64

:-)

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM