Question

我有一个包含带有2个标签的标签控件的视图。我已为每个选项卡定义了一个别名，格式如下：

alias: 'widget.contenttab'

我正在尝试访问控制器中的'contenttab'，但它说它没有定义：

contenttab is not defined

我正在尝试在控制器的select处理程序中设置选项卡的html内容：

Ext.define('BP.controller.Induction', {
extend: 'Ext.app.Controller',

views: [
    'induction.Binder',
    'induction.LeftPage',
    'induction.RightPage',
],

stores: [
    'Sections',
    'Categories',
    'Tasks'
],

models: [
    'Section',
    'Category',
    'Task'
],


init: function() {
    this.control({
        'grid[xtype=categorygrid]': {
            itemclick: this.onItemClick 
        }
    });
    console.log('Initialized Induction!');
},


onItemClick: function(e, d) {
    console.log(d.data.category_id);
    this.getCategoriesStore().load({params:{'id':d.data.category_id}}, {
        success: function(category) {
            console.log("Category: " + category.get('name'));
        },
        error: function(e) {
            console.log(e);
        }
    });
    contenttab.html = 'test'; // produces error

}
});

'contenttab'位于我的RightPage视图中。产生错误的行最终需要驻留在成功回调函数中 - 但这不会被解雇（我在这里为此问题创建了另一个问题Extjs store load success handler not getting fired

感谢任何指导，谢谢。

Answer 1

在您的情况下，您应该使用 ComponentQuery 来接收标签实例。我想你至少会知道你的标签名称，所以你可以做到

var single = Ext.ComponentQuery.query('contenttab[title=YourTabName]')[0];

或者如果您需要该类型的所有标签。

var list = Ext.ComponentQuery.query('contenttab');

结果将始终是一个数组，我在第一个例子中使用了数组选择器。您可以随时执行此操作以获取实例。但是，对于同一个实例，您执行此操作的次数越多，我建议您将实例存储为局部变量。特别是当你在一个循环中的路上。

这也是控制器中的 ref 属性，可以自动为您执行某些操作。一些例子：

refs: [
        {
            ref: 'firstTab',
            selector: 'contenttab[title=YourTabName]'
        }
    ]

这将创建一个名为getFirstTab()的方法（请注意auto camel-case），该方法引用您的选项卡（基于提供的查询）。请注意，还有更多选项，例如autocreate。我必须说，我从来没有使用过这个，但它包含了一些适合你的东西，这可能在启动时很好。

回答您对previous question的最后评论：是的，这是正确的方法。

Answer 2

提供别名允许您在Ext.widget（'contenttab'）方法中使用它来创建组件的实例。但它不会创建全局变量'contenttab'。

它做的另一件事是在Component Manager中的'contenttab'名称下注册'xtype'。因此，您可以按照

中的xtype引用组件

...
items:[ 'contenttab' ],
....

别名文档：http://docs.sencha.com/ext-js/4-1/#!/api/Ext.Class-cfg-alias 还有一些例子： http://docs.sencha.com/ext-js/4-1/#!/guide/application_architecture

Extjs查看别名/ xtype未在控制器中定义

2 个答案: