本文地址：[http://blog.csdn.net/sushengmiyan/article/details/39078627](http://blog.csdn.net/sushengmiyan/article/details/39078627) sencha官方API:[?http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.panel.Panel-cfg-viewModel](http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.panel.Panel-cfg-viewModel)[](http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext-method-each) 本文作者：[sushengmiyan](http://blog.csdn.net/sushengmiyan) ------------------------------------------------------------------------------------------------------------------------------------ ?Sencha ext js 5之前的版本中是沒有viewmodel這個概念的，現在extjs5既然支持mvvm模式了，那么她的組件也就相應的增加了對mvvm的默認支持。現在看看我們經常使用的panel組件對mvvm模式的強大支持。 先看看文檔對panel的viewmodel屬性的定義： ~~~ viewModel : String/Object/Ext.app.ViewModel The ViewModel is a data provider for this component and its children. The data contained in the ViewModel is typically used by adding bind configs to the components that want present or edit this data. When set, the ViewModel is created and links to any inherited viewModel instance from an ancestor container as the "parent". The ViewModel hierarchy, once established, only supports creation or destruction of children. The parent of a ViewModel cannot be changed on the fly. If this is a root-level ViewModel, the data model connection is made to this component's associated Data Session. This is determined by calling getInheritedSession. Defaults to: {$value: null, lazy: true} ~~~ 將上述信息翻譯一下如下： viewModel:屬性可以設置為字符串String或者Object對象或者是Ext.app.ViewModel ViewModel是這個組件和子構件的數據提供者，ViewModel中包含的數據典型的使用方法就是增加bind配置到想呈現或者編輯數據的組件上。 當設置好了，viewmodel就創建并連接到繼承層次上任何父組件，一旦創建，父組件就無法更改子構件。 如果是根viewmodel，datamodel就關聯到數據節點，這有獲取繼承節點來決定。 默認：{$value:null, lazy:true} 簡單說，就是當你想在panle中獲取其他model的data中的數據的時候，就需要制定viewmodel，這有就可以從viewmodel中獲取數據啦。