Extjs 获取对自动实例化Sencha Touch 2视图的引用

我想从我的Sencha Touch 2控制器获取我的视图的引用，它看起来像这样（CoffeeScript）：

---

出现“Hello，Books”内容（例如，呈现组件），但从未调用呈现控制处理程序。我做错了什么？

您不应该对任何类使用硬编码的

id

！您应该将您的视图编码为：

Ext.define('MyApp.view.Books',{
    extend: 'Ext.Panel',
    alias : 'widget.books',
    config: {
        html: 'Hello, Books!'
    },
    initialize : function() {   
        // some init code etc..
        this.callParent();  
    }
});

请注意alias属性。这有助于获取视图实例的引用。当您参考视图时。现在，在控制器中，您有：

...
this.control({
    'books' : {    
        render: function() {
            console.log('Render method called!');
        },
        show: function() {
            console.log('Show method called!');
        }

    },
    .
    ...

请注意，您不是通过id属性引用视图，而是通过其别名或xtype引用视图。现在，如果需要访问其他控制器的视图或控制器中的任何其他组件，也可以使用refs系统。在这种情况下，您将在控制器定义中定义refs数组，如下所示：

refs: [
    {ref: 'centerPane', selector: 'centerpane'}
],

这里的选择器属性是传递给

Ext.ComponentQuery

以获取组件的值。因此，您可以通过以下方式获取centerpane的实例：

this.getCenterPane();

---

您不应该对任何类使用硬编码的

id

！您应该将您的视图编码为：

Ext.define('MyApp.view.Books',{
    extend: 'Ext.Panel',
    alias : 'widget.books',
    config: {
        html: 'Hello, Books!'
    },
    initialize : function() {   
        // some init code etc..
        this.callParent();  
    }
});

请注意alias属性。这有助于获取视图实例的引用。当您参考视图时。现在，在控制器中，您有：

...
this.control({
    'books' : {    
        render: function() {
            console.log('Render method called!');
        },
        show: function() {
            console.log('Show method called!');
        }

    },
    .
    ...

请注意，您不是通过id属性引用视图，而是通过其别名或xtype引用视图。现在，如果需要访问其他控制器的视图或控制器中的任何其他组件，也可以使用refs系统。在这种情况下，您将在控制器定义中定义refs数组，如下所示：

refs: [
    {ref: 'centerPane', selector: 'centerpane'}
],

这里的选择器属性是传递给

Ext.ComponentQuery

以获取组件的值。因此，您可以通过以下方式获取centerpane的实例：

this.getCenterPane();

---

谢谢，这是一个很好的解释！最近我还认为我不应该使用ID，所以我确实停止了使用它们，但我仍然不知道如何获取引用，所以我开始使用

name:

properties和

.down（“[name=…]”）

，这显然不是它的用途。再次感谢您的回答。我也在努力解决这个问题，示例程序似乎完全是人为设计的，从来没有显示您如何实际获得自动实例化视图。非常好的解释谢谢，这是一个非常好的解释！最近我还认为我不应该使用ID，所以我确实停止了使用它们，但我仍然不知道如何获取引用，所以我开始使用

name:

properties和

.down（“[name=…]”）

，这显然不是它的用途。再次感谢您的回答。我也在努力解决这个问题，示例程序似乎完全是人为设计的，从来没有显示您如何实际获得自动实例化视图。很好的解释