EXTJS4官方文档翻译系列一:类系统和编码规范
这个要领很轻易从现有的类中担任建设新的类.对比直接担任,我们没有好用的API用于类建设的其他方面,诸如:设置、静态要领、混入(Mixins)。呆会我们再来具体的从头审阅这些方面。此刻,让我们来看看另一个例子: 1: My.cool.Window = Ext.extend(Ext.Window, { ... });
在这个例子中,我们建设我们的新类,担任Ext.Window,放在定名空间中。我们有两个题目要办理:
第一个题目凡是行使Ext.namespace(别名Ext.ns)来办理.该要领递归建设(假如该工具不存在)这些工具依靠.较量繁琐死板的部门是你必需在Ext.extend之前执行Ext.ns来建设它们. 1: Ext.ns('My.cool'); 2: My.cool.Window = Ext.extend(Ext.Window, { ... }); 第二个题目欠好办理,由于Ext.Window也许直接或间接的依靠于很多其他的类,依靠的类也许还依靠其余类...出于这个缘故起因,在ext4之前,我们凡是引入整个ext-all.js,纵然是我们只必要个中的一小部门. 1.2) 新的方法 在Extjs4中,你只必要行使一个要领就可以办理这些题目:Ext.define.以下是它的根基语法: 1: Ext.define(className, members, onClassCreated); onClassCreated: 可选的回调函数,在全部依靠都加载完毕,而且类自己成立后触发.因为类建设的新的异步特征,这个回调函数在许多环境下都很有效.这些在第四节中将进一步接头 譬喻: 1: Ext.define('My.sample.Person', { 2: name: 'Unknown', 3: 4: constructor: function(name) { 5: if (name) { 6: this.name = name; 7: } 8: 9: return this; 10: }, 11: 12: eat: function(foodType) { 13: alert(this.name + " is eating: " + foodType); 14: 15: return this; 16: } 17: }); 18: 19: var aaron = Ext.create('My.sample.Person', 'Aaron'); 20: aaron.eat("Salad"); // alert("Aaron is eating: Salad"); 留意我们行使Ext.create()要领建设了My.sample.Person类的一个新实例.我们也可以行使新的要害字(new My.sample.Person())来建设.然而,提议养成始终用Ext.create来建设类示例的风俗,由于它应承你操作动态加载的上风.更多关于动态加载信息,请看入门指南:入门指南 2).设置 在ExtJS 4 ,我们引入了一个专门的设置属性,用于提供在类建设前的预处理赏罚成果.特征包罗: 1: Ext.define('My.own.Window', { 2: /** @readonly */ 3: isWindow: true, 4: 5: config: { 6: title: 'Title Here', 7: 8: bottomBar: { 9: enabled: true, 10: height: 50, 11: resizable: false 12: } 13: }, 14: 15: constructor: function(config) { 16: this.initConfig(config); 17: 18: return this; 19: }, 20: 21: applyTitle: function(title) { 22: if (!Ext.isString(title) || title.length === 0) { 23: alert('Error: Title must be a valid non-empty string'); 24: } 25: else { 26: return title; 27: } 28: }, 29: 30: applyBottomBar: function(bottomBar) { 31: if (bottomBar && bottomBar.enabled) { 32: if (!this.bottomBar) { 33: return Ext.create('My.own.WindowBottomBar', bottomBar); 34: } 35: else { 36: this.bottomBar.setConfig(bottomBar); 37: } 38: } 39: } 40: }); 以下是它的用法: 1: var myWindow = Ext.create('My.own.Window', { 2: title: 'Hello World', 3: bottomBar: { 4: height: 60 5: } 6: }); 7: 8: alert(myWindow.getTitle()); // alerts "Hello World" 9: 10: myWindow.setTitle('Something New'); 11: 12: alert(myWindow.getTitle()); // alerts "Something New" 13: 14: myWindow.setTitle(null); // alerts "Error: Title must be a valid non-empty string" 15: 16: myWindow.setBottomBar({ height: 100 }); // Bottom bar's height is changed to 100 3.Statics (编辑:湖南网) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |