[ExtJS5学习笔记]第十六节 Extjs5使用panel新增的ViewModel属性绑定数据

简介:

sencha官方API: http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.panel.Panel-cfg-viewModel

本文作者: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中获取数据啦。


相关文章
|
监控 Java Linux
开源流程引擎Camunda
开源流程引擎Camunda
|
JavaScript 前端开发 Java
51jqGrid 分组 - 远程数据(排序过)
51jqGrid 分组 - 远程数据(排序过)
108 0
51jqGrid 分组 - 远程数据(排序过)
|
XML JSON 前端开发
基于若依的ruoyi-nbcio流程管理系统仿钉钉流程json转bpmn的flowable的xml格式(支持并行网关)
基于若依的ruoyi-nbcio流程管理系统仿钉钉流程json转bpmn的flowable的xml格式(支持并行网关)
1027 3
|
IDE Java 编译器
lombok编译遇到“找不到符号的问题”
【9月更文挑战第18天】当使用 Lombok 遇到 “找不到符号” 的问题时,可能是由于 Lombok 未正确安装、编译器不支持、IDE 配置不当或项目构建工具配置错误。解决方法包括确认 Lombok 安装、编译器支持,配置 IDE 和检查构建工具配置。通过这些步骤通常可解决问题,若问题仍存在,建议检查项目配置和依赖,或查看日志获取更多信息。
5640 2
|
存储 NoSQL JavaScript
mongodb时间处理,时区处理
mongodb时间处理,时区处理
3931 2
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的学生宿舍管理系统附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的学生宿舍管理系统附带文章和源代码部署视频讲解等
173 0
|
存储
leetcode:415. 字符串相加(模拟竖式计算)
leetcode:415. 字符串相加(模拟竖式计算)
197 0
|
物联网 API
阿里云API芝士堂[物模型管理][模板]
上次介绍了物模型的模型,这次介绍一下物模型的模板,因为模板涉及到的接口只有查询所有模板列表和得到指定列表列表两个api,所以连同其他查询相关的接口一同测试,本文涉及到的接口列表如下六个:
320 0
|
存储 监控 Java
江帅帅:精通 Spring Boot 系列 01
Spring 框架,作为一个非常优秀的轻量级容器,在企业级项目开发中非常受欢迎,但它在使用期间需要整合众多第三方资源,都会导致配置过于臃肿,这也是令大家非常头疼的问题。