如何在组件内缓存子组件实例

Question

我在网上找到很多Sencha Touch的例子,并没有真正专注于正确的视图封装.因此,即使按钮深度嵌套在视图中,Controller也会监听每个按钮的事件.换句话说,视图泄漏的内部从来都不是一件好事.

我找到了一个很好的教程,鼓励你创建有意义的观点,听取当地的事件,并提出有意义的商业活动等.

http://miamicoder.com/2012/how-to-create-a-sencha-touch-2-app-part-2/

但是,到目前为止我无法弄清楚的一件事是如何最好地缓存嵌套组件实例.考虑这个例子:

Ext.define("NotesApp.view.NotesListContainer", {
    extend: "Ext.Container",
    alias: "widget.noteslistcontainer",

    initialize: function () {

        this.callParent(arguments);

        var newButton = {
            xtype: "button",
            text: 'New',
            ui: 'action',
            handler: this.onNewButtonTap,
            scope: this
        };

        var topToolbar = {
            xtype: "toolbar",
            title: 'My Notes',
            docked: "top",
            items: [
                { xtype: 'spacer' },
                newButton
            ]
        };

        this.add([topToolbar]);
    },
    onNewButtonTap: function () {
        console.log("newNoteCommand");
        this.fireEvent("newNoteCommand", this);
    },
    config: {
        layout: {
            type: 'fit'
        }
    }
});

比方说,我们要添加一个方法setSpecialUIState给我们的NotesListContainer.当它被调用时,我们想要做一些事情newButton(例如隐藏它).如何在newButton不滥用的情况下获取对实例的访问权限Ext.getComp()？我可以将其设置为实例变量吗？规范方式如何？

UPDATE

正如Nikolaj Borisik建议的那样,我试过这个.

    this._newButton = this.add([{
            xtype: "button",
            text: 'New',
            ui: 'action',
            handler: this.onNewButtonTap,
            scope: this
        }];

这就像一个魅力.我只是不知道它是否是惯用的,或者是否有任何缺点我可能会遗漏.否则我强烈建议这样做.除了Sencha之外,构建有意义的视图可以更好地抽象出连贯的UI部分.这比将每个按钮泄漏到控制器并直接与它们进行操作要好得多.

所以我想知道这种方法是否有任何缺点？

Answer 1

在我花了更多时间研究 Sencha 后，我发现我对Ext.getCmp(). 我认为这会首先查询 DOM 以找到匹配的 ID，然后尝试获取与其绑定的组件实例。然而，它的作用并非如此。事实上，它根本不查询 DOM。它只是查询一个名为 ComponentManager 的工具，该工具保存对正在使用的所有组件的引用。

所以，使用它并没有那么脏。然而，我们仍然可以做得更好。

每个容器都支持方法child(selector)和down(selector)查询子组件。虽然乍一看这似乎是在查询 DOM，但实际上这只是查询 ComponentManager。它在起点使用容器并查询其内部项目。两者的区别在于，child(selector)只查询第一个子级别，而down(selector)查询所有子级别。

我想使用它们来处理这些子组件是可以的。但是，如果由于重复调用这些方法而仍然存在性能问题，我建议在第一次检索后缓存这些方法。