`
chuanru920
  • 浏览: 7909 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

[转]ext.class

    博客分类:
  • ext
阅读更多

xt.Class 属性详解 :


1 ,  alias : 相当于别名一样,可以起多个,可以通过xtype和Ext.widget()创建实例:

 

Js代码  收藏代码
  1. Ext.define('SimplePanel', {  
  2.     extend: 'Ext.panel.Panel',  
  3.     alias: ['widget.simplepanel_007','widget.simplepanel_008'],  
  4.         title: 'Yeah!'  
  5. });  
  6.   
  7. //通过Ext.widget()创建实例  
  8. Ext.widget('simplepanel_007',{  
  9.     width : 100,  
  10.     height : 100  
  11. }).render(Ext.getBody());  
  12.   
  13. //通过xtype创建  
  14. Ext.widget('simplepanel_007', {  
  15.     width : 100,  
  16.     items: [  
  17.         {xtype: 'simplepanel_008', html: 'Foo'},  
  18.         {xtype: 'simplepanel_008', html: 'Bar'}  
  19.     ]  
  20. }).render(Ext.getBody());  

 

2 , alternateClassName : 跟alias有点类似,相当于给类找替身,可以多个,可以通过Ext.create()创建实例:

 

Js代码  收藏代码
  1. Ext.define('Boy', {  
  2.        //定义多个替身  
  3.        alternateClassName: ['boy2''boy3'],  
  4.        say : function(msg){  
  5.         alert(msg);  
  6.     }  
  7. });  
  8.               
  9. var boy1 = Ext.create('Boy');  
  10. boy1.say('I am boy1...');  
  11.   
  12. //可以通过alternateClassName实例化该类  
  13. var boy2 = Ext.create('boy2');  
  14. boy2.say('I am boy2...');  
  15.   
  16. var boy3 = Ext.create('boy3');  
  17. boy3.say('I am boy3...');  

 

3 , config:类的属性配置,属性可以自动生成geter/seter方法

 

Js代码  收藏代码
  1. Ext.define('Boy', {  
  2.     config : {  
  3.         name : 'czp',  
  4.         age : 25  
  5.     },  
  6.     constructor: function(cfg) {  
  7.             this.initConfig(cfg);  
  8.     }  
  9. });  
  10.               
  11. var czp = Ext.create('Boy',{name:'czpae86'});  
  12. //通过getName()方法获得属性name值  
  13. alert(czp.getName());  
  14. //通过setAge()方法改变属性age值  
  15. czp.setAge(25.5);  

 

4 , extend : 继承,可以继承单个类

 

Js代码  收藏代码
  1. Ext.define('Person', {  
  2.     say: function(text) { alert(text); }  
  3. });  
  4. Ext.define('Boy', {  
  5.     extend : 'Person'  
  6. });  
  7.               
  8. var czp = Ext.create('Boy');  
  9. //继承了Person,所以可以使用say()方法  
  10. czp.say('my name is czp.');  

 

5 , inheritableStatics : 定义静态方法,可以通过"类名.方法名"调用静态方法. 类似 statics属性,

区别是:子类也可以使用该静态方法,但statics属性定义的静态方法子类是不会继承的.

Js代码  收藏代码
  1. Ext.define('Person', {  
  2.     inheritableStatics : {  
  3.         sleep : function(){  
  4.             alert('sleep');  
  5.         }  
  6.     },  
  7.     say: function(text) { alert(text); }  
  8. });  
  9.   
  10. Ext.define('Boy', {  
  11.     extend : 'Person'  
  12. });  
  13.   
  14. //子类可以通过"类名.方法名"调用父类通过"inheritableStatics"定义的方法  
  15. Boy.sleep();  

 

6 , mixins : 可以实现多继承

 

Js代码  收藏代码
  1. Ext.define('Person', {  
  2.     say: function(text) { alert(text); }  
  3. });  
  4.   
  5. Ext.define('Boy', {  
  6.     play : function(){  
  7.         alert('play');  
  8.     }  
  9. });  
  10.   
  11. Ext.define('Gird', {  
  12.     sleep : function(){  
  13.         alert('sleep');  
  14.     }  
  15. });  
  16.               
  17. Ext.define('A_007', {  
  18.     //继承Person  
  19.     extend : 'Person',  
  20.     //同时继承'Boy','Gird'  
  21.     mixins : ['Boy','Gird']  
  22. });  
  23.               
  24. var a_007 = new A_007();  
  25. a_007.say('我可以say,也可以play,还可以sleep!!');  
  26. a_007.play();  
  27. a_007.sleep();  
 

7 , singleton : 创建单例模式的类, 如果singleton为true,那么该类不能用通过new创建,也不能被继承

 

Js代码  收藏代码
  1. Ext.define('Logger', {  
  2.     //singleton为true  
  3.     singleton: true,  
  4.     log: function(msg) {  
  5.         alert(msg);  
  6.     }  
  7. });  
  8. //方法调用"类名.方法名"  
  9. Logger.log('Hello');  

 

 8 , statics : 与第5个inheritableStatics属性类似,statics属性定义的静态方法子类是不会继承的.请看第5个属性.

 

 9 , uses 和 requires : 与requires属性类似,都是对某些类进行引用

uses -- 被引用的类可以在该类之后才加载.

requires -- 被引用的类必须在该类之前加载.

 

Js代码  收藏代码
  1. Ext.define('Gird', {  
  2.     uses : ['Boy'],  
  3.     getBoy : function(){  
  4.         return Ext.create('Boy');  
  5.     },  
  6.     sleep : function(){  
  7.         alert('sleep');  
  8.     }  
  9. });  
  10.   
  11. //对于uses属性,Boy类放在后面是可以的,不会报错  
  12. Ext.define('Boy', {  
  13.         play : function(){  
  14.                alert('play');  
  15.         }  
  16. });  
  17.   
  18.   
  19. //对于requires属性,Boy类必须在Grid类之前加载,不然会报错  
  20. Ext.define('Boy', {  
  21.     play : function(){  
  22.         alert('play');  
  23.     }  
  24. });  
  25.               
  26. Ext.define('Gird', {  
  27.     requires : ['Boy'],  
  28.     getBoy : function(){  
  29.         return Ext.create('Boy');  
  30.     },  
  31.     sleep : function(){  
  32.         alert('sleep');  
  33.     }  
  34. });  
 转自: http://www.iteye.com/topic/1114276

分享到:
评论

相关推荐

    Ext.form表单中各种属性应用详解

    - **fieldClass**: 类型为 `String`,定义字段的 CSS 类,默认为 `x-form-field x-form-num-field`。 - **maxText**: 类型为 `String`,当输入值超过最大值时显示的文本。 - **maxValue**: 类型为 `Number`,定义...

    Ext.DataView 图片列表显示

    overClass : 'phone-hover', singleSelect: true, multiSelect : false, autoScroll : true }); new Ext.Panel({ layout: 'fit', items : dataview, height: document.body.clientHeight, width: ...

    Ext.ux.UploadDialog

    The class is ready for i18n, override the Ext.ux.UploadDialog.Dialog.prototype.i18n object with your language strings, or just pass i18n object in config. Server side handler. The files in the queue...

    Java反编译工具把.class文件转换为.java文件

    - 若要改变输出文件的扩展名,可以使用选项`-s <ext>`,例如:`jad -s java example1.class`将会生成名为`example1.java`的文件。 3. **进阶功能**: - 支持通配符:用户可以在输入文件名时使用通配符,如`jad *....

    ext js 4.1apply && override

    Ext.override(originalClass, overrides); ``` - `originalClass`: 需要覆盖的原始类。 - `overrides`: 包含需要覆盖方法的新版本的对象。 ##### 2. 实现原理 根据提供的代码片段,我们可以看到`Ext.override`的...

    EXT核心API详解

    '#foo a, #bar span.some-class@mouseover' : function(){ // do something } }); apply( Object obj, Object config, Object defaults ) : Object 从config拷贝所有的属性到obj,如果有defaults参数,也将拷贝其...

    如何在服务器端 读取Ext.ux.UploadDialog上传的文件?

    public class UpFileServlet extends HttpServlet { private String uploadPath = "c:\\Upfile\\"; private String tempPath = "c:\\upfiel"; public void doPost(HttpServletRequest request, ...

    Ext.Direct.Mvc是ASP.NET Mvc.的Ext Direct服务器端堆栈的实现.zip

    public class TestController : Controller { [DirectMethod] public ActionResult GetData() { var data = new[] { "Item1", "Item2", "Item3" }; return Json(data, JsonRequestBehavior.AllowGet); } } ```...

    Ext Js权威指南(.zip.001

    4.4.5 管理类的类:ext.classmanager / 159 4.4.6 类创建的总结 / 161 4.5 动态加载的路径设置 / 163 4.6 综合实例:页面计算器 / 165 4.7 本章小结 / 169 第5章 ext js的事件及其应用 / 170 5.1 概述 / 170 ...

    Extjs4.X下comboboxTree下拉树型菜单,完美支持多选、单选,绝对好用

    tpl: '<tpl for="."><div class="x-combo-list-item">{text}</div></tpl>', listConfig: { itemSelector: 'div.x-combo-list-item' } }); ``` 这个例子创建了一个多选的ComboboxTree,其数据源是一个包含部门...

    EXT JS 3.0 Core Class Diagram

    EXT JS 3.0 Core Class Diagram 是一个关于EXT JS库核心类结构的图表,它展示了EXT JS 3.0版本中的主要组件和它们之间的关系。EXT JS是一个强大的JavaScript库,主要用于构建富客户端Web应用程序,其核心功能包括...

    xUtils3.3.6源码

    -keepattributes Signature,Annotation -keep public class org.xutils.** { public protected ; } -keep public interface org.xutils.* { public protected ; } -keepclassmembers class * extends org.xutils.* {...

    GridPanel中的单元格不能选中复制的解决方法

    Ext.grid.GridPanel 是一个功能强大且广泛使用的Grid控件,但是它存在一个很大的缺陷:单元格的内容不能选中,没法选中就没法复制,这给用户带来了很多不便。这个问题的根源在于ExtJs输出的代码中,每个单元格的div...

    Ext入门学习.docx

    ExtJS 中的对象追加属性和方法是通过 Ext.apply() 函数来实现的,例如 Ext.apply(Ext.cc.Class1.prototype, {bb:"bb", cc:"cc", dd:function(){alert("ddd")} })。 ExtJS 的优点包括: 1. 可以快速地构建复杂的 ...

    Ext_Js分页显示案例详解

    ### Ext_Js分页显示案例详解 #### 一、引言 在Web开发领域,Ext_Js(简称ExtJS)是一种强大的JavaScript库,用于构建复杂的客户端应用。它提供了一套丰富的UI组件,使得开发者能够轻松地创建美观且功能强大的用户...

    Jquery+ext

    1. **选择器**: jQuery通过CSS选择器来选取DOM元素,这使得选取元素变得极其简单,如`$("#myID")`选取ID为"myID"的元素,`$(".myClass")`选取所有class为"myClass"的元素。 2. **链式操作**: jQuery对象是链式操作...

Global site tag (gtag.js) - Google Analytics