views:  ['StationsList']  //  creates  getter  named  'getStationsListView'  ->  returns  reference  to 
StationsList class 
models: ['Station']       // creates getter named 'getStationModel'     -> returns reference to Station 
model class 
controllers: ['Song']     // creates getter named 'getSongController'     -> returns the Song controller 
instance 
stores:  ['Stations']       //  creates  getter  named  'getStationsStore'       ->  returns  the  Stations  store 
instance

这里有一点很重要，视图和模型的

get 方法返回类 (Class) 的引用,而存储和控制器返回的是

具体的实例引用。

 

视图实例
前面说到存储、模型、控制器和视图通过配置会自动创建

get*方法，这使得我们很方便的获

得他们的引用。

getStationsListView() 将会返回这个视图类的 class 引用。在我们的业务流程中，

我们希望选在电台列表的第一项，在这种需求下，我们需要的不仅仅是一个视图的类的引
用，我们更需要

StationsList 在 viewport 中的视图实例引用。

在

 Ext JS 3 中，有一种很普遍的方法来获取页面上某个组件的实例，就是通过  Ext.getCmp 

方法。在

Ext JS 4 中，这个方法依然有效，但不建议您使用。因为使用这个方法需要你提供

一个组件的具体

id。在新的 MVC 框架包中，我们可以通过使用 ComponentQuery 这个新方

法，在控制器里面获得一个试图的实例引用。

app/controller/Station.js
...
refs: [{
    // A component query
    selector: 'viewport > #west-region > stationslist',
    ref: 'stationsList'
}]
...
通过

 refs 配置项，你可以建立视图实例的引用，这样就可以在控制器的交互里面获得和维

护页面上的组件。而如何描述该引用指向的具体引组件，则要在

selector 配置项中使用一个

组件查询

 (ComponentQuery). ref 属性值是在创建 get 方法作为 get* 方法名的后半部分。例如，

通过配置

 ref : 'stationsList' ，则会生成控制器的一个名为 getStationsList 的方法。当然，如果

你没有配置

refs ，你还是可以通过使用 Ext.getCmp 来获得你想要的组件实例，如果你要用

 

getCmp，则就要你自己去管理整个程序中的组件 id，随着项目的扩大会出现很多问题，所
以这是很不推荐的。

要记住，无论视图是否能在页面中找到，这些不存在的视图的

get 方法依然会创建。当你首

次调用

getXxx 方法，对应的选择器成功在页面上匹配到一个组件后，这个结果会被缓存起