`

Ext2的 组件X类型 XTypes

阅读更多
xTypes是Ext 2.0中新的概念,被认为是Ext特定组件类型。可用的xtype摘要可在 Component class API开头的地方找到。与一般JavaScript对象用法相似,XTypes可用于查找或比较组件对象,如isXType和getXType的方法。 你亦可以列出任意组件的xtpye层次表,用方法getXTypes。

然而,如何把Xtypes用于优化组件的创建和渲染过程才是XTypes发挥威力的地方。 通过指定一个xtype的配置对象的写法,可隐式声明的方式创建组件,使得如果没有渲染的需要就只是一个对象而免去实例化的步骤,这时不仅渲染的动作是延时的,而且创建实际对象的这一步也是延时的,从而节省了内存和资源。 在复杂的布局中,这种性能上的改进尤为明显。

//显式创建所容纳的组件
var panel = new Ext.Panel({
...
items: [
new Ext.Button({
text: 'OK'
})
]
};

//使用xtype创建
var panel = new Ext.Panel({
...
items: [{
xtype: 'button',
text: 'OK'
}]
};

第一个例子中,面板初始化的同时,按钮总是会立即被创建的。如果加入较多的组件,这种方法很可能界面的渲染速度。

第二例子中,按钮直到面板真正在浏览器上显示才会被创建和渲染。

如果面板从未显示(例如有个tab一直是隐藏的),那么按钮就不会被创建,不会消耗任何资源了。
分享到:
评论

相关推荐

    Ext组件说明 Ext组件概述

    ### Ext组件概述与初学者指南 #### 一、Ext组件概览 Ext是一个功能丰富的JavaScript框架,用于构建桌面级Web应用程序。它提供了大量的组件和工具,使得开发者能够快速且高效地构建用户界面。对于初学者而言,理解...

    Ext2.x中文api 非常完美的中文api

    Ext2.x API提供了丰富的组件和功能,帮助开发者构建交互性强、用户体验良好的Web应用。下面将详细阐述这个API的主要知识点: 1. **Ext JS 框架**:Ext JS是一个开源的JavaScript库,主要用于构建富客户端的Web应用...

    Ext继承--Ext自定义组件的书写方式

    2、发布到Web服务器、并且启动服务器 3、打开IE之后在地址输入:http://localhost:8080/ExtCumstomComponent/ 4、如果一切正常,你会到看自定义的面板出来浏览器 目的:该示例非常详细注释说明Ext的面向对象的编程...

    ext上传组件,可以多文件上传

    2. **文件选择和预览**:利用EXT上传组件,用户可以一次性选择多个文件,并在上传前进行预览,这需要在JavaScript中配置SwfUpload的相关参数。 3. **进度条和状态提示**:SwfUpload.js支持文件上传进度的实时显示,...

    EXT2.X API 半中文纯HTML版 无需ARI

    EXT2.X API 是一个用于开发Web应用程序的JavaScript库,它为构建富互联网应用程序(Rich Internet Applications,RIA)提供了丰富的组件和功能。这个API是半中文纯HTML版本,意味着它的文档和部分源代码是以中文编写...

    ClientSocketAI2Ext

    "ClientSocketAI2Ext" 是一个专为App Inventor 2(AI2)设计的扩展组件,用于增强其原生的TCP套接字(socket)功能。App Inventor 2是一个可视化的编程环境,允许初学者和专业人士创建移动应用程序,而无需深入学习...

    Ext组件描述,各个组件含义

    ### Ext组件概述与详解 #### 一、Ext基础组件 **1.1 Box Component (Ext.BoxComponent)** - **xtype**: `box` - **功能描述**:Box Component 是一个非常基本的 Ext 组件,主要用于定义具有边框和其他布局属性的...

    Ext3.x样式 Ext3.x皮肤

    Ext3.x是一款经典的JavaScript库,主要用于构建富客户端应用程序,它提供了丰富的用户界面组件和强大的数据管理功能。在Ext3.x中,"样式"和"皮肤"是两个关键概念,它们对于提升应用程序的视觉效果和用户体验至关重要...

    Ext编辑组件,方便编写extjs

    2. **多种编辑类型**:组件可能支持文本、数字、日期、选择等多种类型的编辑器,以适应不同字段的数据类型。 3. **实时保存**:在用户编辑完单元格后,可以立即保存更改,提高用户体验并减少错误。 4. **行级编辑*...

    Ext2的日期组件只选择年月

    标题 "Ext2的日期组件只选择年月" 暗示了我们正在讨论一个特定的JavaScript库,可能是ExtJS的旧版本(版本2),其中的一个日期选择组件。这个组件允许用户仅选择年份和月份,而不是完整的日期。ExtJS是一个流行的富...

    Ext2.0 文件上传组件

    "Ext2.0 文件上传组件"是一个用于Web应用程序的组件,它允许用户在浏览器中方便地上传文件。这个组件基于Ext JavaScript库的2.0版本,Ext是一个强大的前端开发框架,提供了丰富的用户界面组件和数据管理功能。在本文...

    ext3.x 改写的datatimefiled时间控件

    在EXT JS框架中,"ext3.x 改写的datetimefield时间控件"是一个自定义组件,主要用于增强原生EXT JS 3.x版本中的DateTimeField功能。这个控件为用户提供了更丰富的日期和时间选择能力,增加了对时、分、秒的选择,...

    ext2.x 在domino中的应用

    综上所述,"ext2.x 在domino中的应用"涉及了EXT JS的组件化开发、Ajax交互、数据绑定、模板布局等多个关键知识点,开发者可以通过这些技术提升Domino应用的用户体验和功能丰富度。同时,有效的集成和优化策略也是...

    [Ext 3.x + Ext 2.x] 下拉树 Ext.ux.ComboBoxTree

    【Ext 3.x + Ext 2.x 下拉树 Ext.ux.ComboBoxTree】是基于ExtJS框架的一个组件,它结合了下拉框(ComboBox)和树形控件(TreePanel)的功能,提供了一种用户友好的选择界面。在网页应用中,这种控件常用于展示层级...

    Ext2.0.2经典的一个JS组件带EXT中文手册.rar

    这个"Ext2.0.2经典的一个JS组件带EXT中文手册.rar"文件包含了该版本的ExtJS组件和相关的中文文档,帮助开发者更好地理解和使用这个框架。 1. **EXT中文手册**: 提供的`EXT 中文手册.doc`是ExtJS的中文文档,这...

    ext.net 1.x DEMO

    EXT.NET 1.x 版本是早期的一个稳定版本,包含了多种基础和高级的组件,支持多种功能,例如数据绑定、表格、图表、表单、布局管理等。这个版本特别适合用于构建企业级应用,因为它提供了完善的API和强大的服务器端...

    Ext2.0组件,全组件和帮助手册

    全组件和帮助手册的提供,对于理解和使用Ext2.0至关重要。 1. **组件体系**: Ext2.0包含了一系列的UI组件,如面板(Panel)、表格(Grid)、表单(Form)、菜单(Menu)、按钮(Button)、工具栏(Toolbar)、树...

    ext.net 组件包

    ext.net 组件 Ext.Net安装和使用:  1.下载最新版本  2.打开下载文件,将包含以下文件:  view sourceprint?1Ext.Net.dll  2Ext.Net.Utilities.dll  3Ext.Net.xml  4Newtonsoft.Json.dll  5Newtonsoft....

    Ext表单组件之textField

    本篇我们主要关注"Ext表单组件之textField",它是最基础也是最常用的输入控件,用于接收用户的文本输入。 一、Ext.form.TextField简介 Ext.form.TextField是Ext JS中的一个核心组件,它允许用户在表单中输入单行...

    ext 颜色改变组件

    EXT Color Change Component,即EXT颜色改变组件,是EXT库中一个用于处理颜色选择和展示的UI组件,它提供了用户友好的界面,使得用户可以在应用中方便地更改颜色。 在EXT框架中,组件是构建用户界面的基本单元,...

Global site tag (gtag.js) - Google Analytics