Question

在优化我的Sencha Touch 2应用时，我多次遇到过这个问题。

很明显，我应该保持DOM轻量级，我的应用程序包含Ext.TabBar和上面的主Ext.Container。每次从视图切换到另一个视图时，我只需删除当前视图并向该Container添加新视图。

但问题是，有些观点有自定义数据。我的意思是他们有内部数据，如html内容，过滤的商店记录等。当我从我的主Container中删除它们时，我想以某种方式将它们的“状态”保存到全局变量，例如：我正在做一个e-商务应用程序与产品详细信息。从主容器中删除详细信息面板时，我想执行以下操作：

var saved_detail_panel = mainContainer.getActiveItem();

如果我可以这样做，稍后当我想将该细节面板添加回主容器时，我可以简单地使用：

mainContainer.add(saved_detail_panel);

我已经多次尝试，但找不到一个有效的。

非常感谢任何帮助。谢谢。

更新：当我将此代码放在控制器中的事件处理程序中时：

var temp = Ext.create('taxi.view.location.LocationPanel', {showAnimation: null});
taxi.main_container = temp;

效果很好，但效果不佳。我想要做的是只在我的 app.js 中创建一次，如下所示：

launch: function(){
var temp = Ext.create('taxi.view.location.LocationPanel', {showAnimation: null});
};

并且只在Controller中使用它：

taxi.main_container = temp;

这是第一次有效。但在第二次，它显示了这个错误：

Uncaught TypeError: Cannot call method 'replaceCls' of null

Answer 1

您可以使用该应用的“全局命名空间”吗？那么您可以在应用程序的任何位置引用MyApp.savedValue吗？

Ext.application({
    name: 'MyApp',

//    views: [],
//    models: [],
//    stores: [],
    controllers: ['Main'],

    launch: function() {
        MyApp.savedValue = "Hello word";
        Ext.Viewport.add(Ext.create('Sencha.view.tablet.MainView'));
    }
});

Sencha示例中的另一个想法是在KitchenSink演示中。在app/controllers/Main.js中，它们使用视图缓存，它在config：{}中设置，并通过getter / setter访问。我认为主控制器始终存在，因此您的缓存始终可用。事实上，如果你的控制器加载到app.js中，并不是所有的控制器都会持续存在吗？

 controllers: ['Main','FooController', 'BarController'],

来自：app/controllers/Main.js

的摘录

config: {
        /**
         * @private
         */
        viewCache: [], // Accessed via getViewCache(), setViewCache()

        ...
},

 createView: function(name) {
        var cache = this.getViewCache(), // Implied getter
            ln = cache.length,
            limit = 20, // max views to cache
            view, i, oldView;

       // See if view is already in the cache and return it
        Ext.each(cache, function(item) {
            if (item.viewName === name) {
                view = item;
                return;
            }
        }, this);

        if (view) {
            return view;
        }

        // If we've reached our cache limit then remove something

        if (ln >= limit) {
            for (i = 0; i < ln; i++) {
                oldView = cache[i];
                if (!oldView.isPainted()) {
                    oldView.destroy();
                    cache.splice(i, 1);
                    break;
                }
            }
        }
        // Create the view and add it to the cache
        view = Ext.create(name);
        view.viewName = name;
        cache.push(view);
        this.setViewCache(cache); // Implied setter

        return view;
    },

Answer 2

试试这个，

var appNS = new Ext.application({

    name: 'app',
    //others

    launch: function () {    
        appNS.SavedValue = 'getting start..........';       
    },

    //others

});

然后你可以在控制器

中使用它

console.log(appNs.SavedValue);

我希望它可能会有所帮助。

Answer 3

另一个解决方案是缓存你的观点。它实际上并不是缓存。首先在您的应用程序中添加一个数组，如。

Ext.application({
name: 'app',


viewCache: [],

viewCacheCount: 0,


launch: function () {     

    this.viewCache.push("app init......."); // push your view

}
});

这可以在任何控制器内部重复，如

ths.getApplication().viewCache.pop();      //pop your view

我不知道如果某些视图/组件可自动销毁，可能会产生一些问题。

Answer 4

尝试在视图中添加autoDestroy: false。

Ext.define('JiaoJiao.view.personal.Card', {

 extend: 'Ext.NavigationView',
 xtype: 'personalContainer',

 config: {

     tab: {
         title: '个人',
         iconCls: 'user',
         action: 'personalTab'
     },

     autoDestroy: false,

     items: [
         {
             xtype:'personal',
             store: 'Personals'
         }
     ]
 }
});

是否可以将Ext.Component声明为全局变量？

4 个答案: