EXTJS 5 学习笔记2 - Components
2024-08-27 20:35:54
1. The Components Hierachy 组件体系
2. XTypes and Lazy Instantiation xtype与延迟初始化
1) 每个component都有一个象征性的名字 xtype
2) 立即初始化: Ext.create() 延迟初始化: xtype
3. Showing and Hiding 显示与隐藏
1) 所有的组件都内置有show() 和 hide() 方法
2) 默认隐藏的css为display:none; 可以通过hideMode配置修改
4. Floating Components 浮动的组件
1) 浮动组件游离于绝对定位的文档流之外,且不参与容器的布局
2) 所有的组件都可以通过floating配置变成浮动组件
3) 浮动组件当show()方法被调用时会自动渲染到document.body下
4) 与浮动组件相关的配置和方法还有:draggable, shadow, alignTo(), center()
5. Creating Custom Components 定制个人组件
1) Composition or Extension 聚合还是扩展
2) Subclassing 子类
a. Ext.Base是所有EXTJS类的基石
3) Template Methods
a. EXTJS使用Template Method模式来把子类特定的方式委托到子类实例上
b. 在组件生命周期的特定阶段中每个继承链中的类都会负责一部分职责
c. Componenet.render()负责初始化组件渲染阶段,且不能被覆盖;render()会调用onRender(), 子类可以覆盖onRender()方法以实现特有的显示样式
Ext.define('My.own.Component', {
extend: 'Ext.Component',
onRender: function() {
this.callParent(arguments);
//perform additional rendering tasks here
...
}
});
d. 注意,必须在使用template methods在生命周期重要的阶段进行业务操作,而不是在事件。因为事件可以被程序挂起或阻止
e. 以下模板方法可以在构建子类时进行覆盖
initComponent
被构造函数调用;用以初始数据、建立配置、绑定事件响应等beforeShow
在组件被显示之前调用onShow
允许在显示过程中增加额外的操作;一旦父类的onShow()方法返回,组件就已经可见afterShow
在组件被显示之后调用onShowComplete
在组件afterShow()方法完成之后调用onHide
允许在隐藏过程中增加额外的操作;一旦父类的onHIde()方法返回,组件就已经隐藏afterHide
在组件被隐藏之后调用onRender
允许在组件渲染过程中增加额外的操作afterRender
允许在组件渲染之后增加额外的操作。在这个阶段组件的样式、可见性、状态等已经生效onEnable
允许在组件启用过程中增加额外的操作。一旦父类的onDisable
()方法返回, 组件就已经启用。onDisable
允许在组件禁用过程中增加额外的操作。一旦父类的onDisable
()方法返回, 组件就已经禁用。onAdded
允许在组件在加入到容器过程中增加额外的操作。在这个阶段组件已经在容器的items集合中。 一旦父类的onAdded
()方法返回,ownerCt引用就已经存在。onRemoved
允许在组件在从容器移除过程中增加额外的操作。在这个阶段组件已经从容器的items集合中移除但还未销毁。 一旦父类的onRemoved
()方法返回,ownerCt引用就已经消失。onResize
允许在组件resize过程中增加额外的操作。onPosition
允许在组件定位过程中增加额外的操作。onDestroy
允许在组件销毁过程中增加额外的操作。一旦父类的onDestroy
()方法返回, 组件就已经销毁。beforeDestroy
允许在组件销毁之前中增加额外的操作。afterSetPosition
允许在组件位置设定之后中增加额外的操作。afterComponentLayout
允许在组件布局完成之后中增加额外的操作。beforeComponentLayout
允许在组件布局完成之前中增加额外的操作。
最新文章
- [python]CentOS 6下安装Python2.7
- xfs磁盘(文件)碎片查看和整理
- error: Your local changes to the following files would be overwritten by checkout:
- 利用IIS管理器模拟CDN
- Discuz!X2大附件上传插件-Xproer.HttpUploader6
- C# 属性、索引
- uiimageView连续帧动画
- java 网络编程(三)---TCP的基础级示例
- (转)Android SlidingTabLayout定制分割线和指示条颜色
- 简单的新浪微博OAuth认证实现
- SQL通过日期计算年龄
- android textView 折叠 展开 ExpandableTextView
- 日积月累:ScrollView嵌套ListView只显示一行
- C++设计模式-singleton单例模式_new
- codeforces 475D. CGCDSSQ
- com.fasterxml.jackson工具类
- 第16月第26天 /bin/bash^M: bad interpreter: 没有那个文件或目录
- Dawn开源项目
- ETL 自动化测试框架
- 170622、springboot编程之JPA操作数据库
热门文章
- natapp搭建外网服务器
- 在Android中使用Android Ksoap2调用WebService
- 解决 ECSHOP v273 产品详情页面评论不显示的问题
- ubuntu安装ssh服务记录
- (转)[unity3d]easytouch的使用
- dobbo 服务配置详解(解决超时重试问题)
- 栅格计算器函数之Con
- SqlServer 之 用 IP 地址连接数据库报错"; 在与 SQL Server 建立连接时出现与网络相关的或特定于实例的错误 ";
- 使用Iperf工具测试android系统网络wifi的吞吐量wifithrougput
- Linux内核二层数据包接收流程