`
isiqi
  • 浏览: 16485573 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

ExtJS 自定义组件

阅读更多

用一段时间EXT,觉得自定义组件还是很有必要

1、不改变Ext的编码风格

2、易于重复利用

扩展可能是基于官方控件的扩展也可能是基于官方基础组件扩展,第一种比较常用,第二种我都去网上Download。。。

第一种扩展

extend (Object subclass,Object superclass,[Object overrides] : Object

比如需要一个文章列表

//完全复制一个自己的grid,没有意义

//第一种方法是重载initComponent函数
var myArticleList = Ext.extend(Ext.grid.GridPanel,{});
//初始化store
var myArticleList = Ext.extend(Ext.grid.GridPanel,{
initComponent:function(){
myArticleList.superclass.initComponent.call(this);
this.store = new Ext.data.JsonStore({
fields:['asdf'],
url:'www.google.com'
});
}
});可以在initComponent中初始化需要的属性,但是重载这个函数一定要记得执行原函数,否则初始化不正确,

myArticleList.superclass.initComponent.call(this);其他就简单了,在里面写上想要的东西,分页、工具条、事件。。。

另外还有个方法就是重载constructor方法,大多数组件的构造函数需要一个config对象,记得在构造函数中写上:

var myArticleList = Ext.extend(Ext.grid.GridPanel,{
constructor:function(config){

Ext.apply(this,config);//将目标config配置赋值给当前组件,有相同的情况下,config中的属性覆盖了this中的,如果做到不覆盖,则用Ext.applyif();

myArticleList.superclass.constructor.call(this);

。。。。。。

}

分享到:
评论

相关推荐

    Extjs自定义组件-下拉树

    ### Extjs自定义组件——下拉树:深入解析与实现 在现代Web开发中,Extjs作为一款功能强大且灵活的框架,深受开发者喜爱。它提供了丰富的UI组件库,能够帮助开发者快速构建复杂的用户界面。其中,自定义组件是Extjs...

    ExtJS如何自定义图片按钮组件

    1.ExtJS自定义组件,图片按钮为例. 2.此图片按钮背景完全为图片,没有边框,需要使用者提供2张图片,一张初始化用,一张点击后用,可在'imgPaths:'属性里填写,格式为'01.jpg~02.jpg' 3.解压后请将所有附件放置您extjs...

    ExtJsCustomComponent:ExtJs自定义组件

    TreeField: 扩展ExtJs4的Ext.form.field.Picker类,当点击下拉框时,异步加载树形结构数据的所有层级,需要后台提供树形结构数据,同时提供当树形列表选择改变后(selectionchange)等自定义事件,和是否为多选,父...

    ExtJs自定义消息框

    ### ExtJs自定义消息框详解 #### 一、引言 在Web开发中,与用户的交互体验至关重要。作为一款优秀的JavaScript框架,ExtJs提供了多种工具和组件帮助开发者快速构建高质量的用户界面。其中,消息框作为一种常见的...

    Android自定义组件开发详解自制书签目录版方便看.pdf

    Android自定义组件开发是一项高级技术,它允许开发者创建具有特定功能的UI组件,以满足应用程序的特殊需求。在深入了解自定义组件的开发之前,需要掌握一些基础知识,比如Java基础、面向对象编程(OOP)以及Android...

    Android自定义组件开发详解

    《Android自定义组件开发详解》一书的作者李赞红在序言中表达了对Android开发教学的热情和对学员成长的关切。他提到,尽管市场上有许多Android开发相关的书籍,但大多数要么偏重理论、要么实践指导不足,或者只是...

    extjs 3.1 组件 使用

    在本篇文章中,我们将深入探讨如何在实际项目中使用ExtJS 3.1的组件。 首先,`css`目录包含了ExtJS 3.1的样式文件。这些CSS文件用于定义组件的外观和布局,包括颜色、字体、边距、边框等。在使用过程中,我们需要...

    ExtJS 自定义树组件 节点的操作 搜索 右键菜单

    功能: 1.实现ExtJS tree 节点右键菜单 实现增删查. 2.实现针对实体数据的动态搜索. 3.代码命名规范,简单易懂. 4.支持IE 9,FF 19.0.2. 5.将文件解压至ext包example任意组件文件夹即可浏览效果.

    Extjs 自定义树结构实现以及动态表头实现

    在本文中,我们将深入探讨如何使用ExtJS框架来实现自定义树结构以及动态表头的功能。ExtJS是一款强大的JavaScript库,常用于构建富客户端应用程序,它提供了丰富的UI组件和强大的数据绑定机制。VS2015是Visual ...

    extjs自定义控件

    下面将详细介绍ExtJS自定义控件的相关知识点。 1. **自定义控件基础** - **组件模型**:ExtJS基于MVC(Model-View-Controller)模式,其中控件(Component)是View层的核心。每个控件都有自己的配置选项、方法和...

    ExtJS日期多选组件源码

    1. **ExtJS组件扩展**:利用ExtJS的MVC模式,我们可以自定义组件(Component)。在这个例子中,`DatePickerPlus`可能是对`Ext.picker.Date`的扩展,增加了多选功能。我们需要覆盖或扩展原有组件的配置项、方法和事件...

    自定义高级查询Extjs

    - 在Ext JS中,这可以通过创建自定义组件(如`Ext.form.Field`子类)和使用事件监听来实现。 3. **涉及的文件解析** - `searchResult.html`:可能是展示查询结果的页面,可能使用了Ext JS的Grid组件来显示数据。 ...

    EXTJS 上传组件及示例

    - `render`:组件渲染完成后触发,可用于自定义组件样式或附加行为。 - `beforeupload`:在文件实际上传前触发,可以在此时取消上传或进行额外的验证。 3. **使用表单提交**: - 上传组件通常与EXTJS的`Ext.form...

    几个不错的EXTJS拓展组件

    在这个"几个不错的EXTJS拓展组件"的压缩包中,你将找到34个经过精心设计和实现的EXTJS扩展组件实例,这些组件可以极大地丰富你的EXTJS应用,并提升用户体验。 首先,EXTJS的扩展组件是对其原生组件功能的增强或特定...

    Extjs树分页组件扩展

    在ExtJS中,树形(Tree)组件是一种用于展示层级数据的强大工具,它允许用户以树状结构浏览和操作数据。然而,在处理大量数据时,一次性加载所有节点可能导致页面响应变慢,这时就需要引入分页功能。"Extjs树分页...

    extjs portal组件代码

    在EXTJS中,"Portal"组件是一种特殊的布局方式,允许用户自定义和排列页面上的内容区块,类似于个人门户的功能。EXTJS 2.0版本虽然相对较老,但其Portal组件仍然具有很高的实用价值,特别是对于那些需要用户高度...

    ExtJS 组件扩展

    为了更好地适应特定业务需求,ExtJS支持自定义组件的扩展与封装。本文将重点探讨ExtJS中组件扩展的两种主要层次及其实践要点。 #### 二、常见错误及原因分析 在使用ExtJS进行组件扩展时,开发人员常常会遇到一些...

    Extjs6 日期时间控件

    在EXTJS6中,日期时间控件是一种强大的用户界面组件,它将传统的日期选择器与时间选择器结合在一起,提供了一种便捷的方式来输入和编辑日期和时间数据。这个控件在许多应用程序中都非常实用,特别是在那些需要精确...

Global site tag (gtag.js) - Google Analytics