Javascript原始的继承写法:
// Traditional constructor:
Ext.Foo = function(config){
// call superclass constructor:
Ext.Foo.superclass.constructor.call(this, config);
this.addEvents({
// add events
});
};
Ext.extend(Ext.Foo, Ext.Bar, {
// class body
}
Extjs中替换constructor,写法如下:
// initComponent replaces the constructor:
Ext.Foo = Ext.extend(Ext.Bar, {
initComponent : function(){
// call superclass initComponent
Ext.Container.superclass.initComponent.call(this);
this.addEvents({
// add events
});
}
}
另外的写法:
IndexPage = Ext.extend(Ext.Viewport, {
initComponent : function() {
this.items = [{
// 内容
}];
IndexPage.superclass.initComponent.call(this);
}
});
IndexPage = Ext.extend(Ext.Viewport, {
constructor : function() {
IndexPage.superclass.constructor.call(this, {
// 内容
});
}
});
还有种写法. (未验证)
var IndexPage = function(){
IndexPage.superclass.constructor.call(this, {
// 内容
});
}
Ext.extend(Ext.Viewport,IndexPage , {
initComponent : function() {
this.items = [{
// 内容
}];
IndexPage.superclass.initComponent.call(this);
}
});
在Ext中,组件的constructor会调用Ext.apply(this, config),即将构造的配置应用到自身,然后调用initComponent进行组件初始化。
第一种方法扩展出的组件,只会修改items,使用时还能再传入其它参数。
第二种就是写死了构造配置,使用时传什么参数都没用。
你可以尝试看看Ext.Component的源码,在目录:src/widgets/Component.js中
分享到:
相关推荐
Extjs 组件继承结构图,亲手整理,可用于Extjs学习时快速理清组件之间的关系
extjs组建继承结构图 让你了解extjs的整个架构!
本文适合有一定javascript基础(明确js的面向对象,继承,作用域等)并能熟练使用extjs框架(明确各组件间的继承关系)的人阅读,目的在于对extjs的前台架构进行性能上的优化,核心思想为:“按需索取,晚使用,晚加载...
ExtJS6 viewModel继承 viewModel各级控件继承演示,动态改变viewModel 详见文章解释 https://blog.csdn.net/ZYD45/article/details/87867454
在Extjs4应用中使用Ext.Loader ======================================= 11条jquery常用技巧和方法整理列表 8个超棒的学习jQuery的网站 JQuery 1.5 getJSON 的使用 JQuery AJAX提交中文乱码的解决方案 Jquery css...
Extjs中使用extend(js继承) 的代码,抄<深入浅出Extjs>书
4.此组件继承的是Ext.Panel,而不是Button,所以此组件并没有所有Ext.Button的功能但是拥有所有Ext.Panel功能并新增了点击事件(使用规范请参照js附件的onReady函数)。本人现正在研究如何重写Ext.Button,如有所收获,...
就是extjs4里面,想给grid里面一格中,文字后面加个小图标。 因为俺们项目就只是文字+图标,所以俺就没有复写Actioncolumn,而是从Column下面继承了一下。。 包含自定义插件源码、效果图等等。
整个项目是作者本人在实际工作中完成的项目部分功能,项目中设计的的技术:...1.ExtJs 常用控件使用 2.ExtJs 日期控件的重写与列表表头菜单控件的重写 3.ExtJs 结合Jquery修改样式和自定义样式 4.JavaScript 伪继承的实现
关于这个原因有很多种,我只说下我遇到的 我这样 写Store来复用的 代码如下: DocStore = Ext.extend(Ext.data.Store,{ initComponent:function(){ this.proxy = new Ext.data.HttpProxy({url:this.url});...
在ExtJS4中使用mixins来实现多继承。具体例子代码如下: 代码如下: (function(){ Ext.onReady(function(){ Ext.define(‘say’,{ canSay:function(){ alert(“hello”); } }); Ext.define(‘eat’,{ caneat:...
之前项目使用的一个深蓝色主题,继承自extjs4原生classic主题。 先引入ext-ux-all.css,再引入fixed.css
NULL 博文链接:https://huiqinbo.iteye.com/blog/2219592
第3章 开始使用ExtJS 3.1 ExtJS概述 3.1.1 ExtJS简介 3.1.2 ExtJS中的基本概念 3.1.3 ExtJS与常见JavaScript库的介绍与对比 3.2 创建第一个程序 3.2.1 下载ExtJS 3.2.2 部署到开发工具中 3.2.3 编写Hello...
本文暂时不介绍如何使用extjs的组件响应事件,而是介绍Extjs的事件的一些实现原理。整个Extjs框架都是以一种面向对象的方式开发的,所以理解Javascript中的继承也很重要。我前面的一篇文章 补点基础:Javascript中的...
NULL 博文链接:https://lovebeyond.iteye.com/blog/1197784
3、演示插件使用和封装插件、面向对象继承等等。4、演示更换皮肤功能。 5、演示json数据封装。6、演示前台和后台数据的传递。7、演示权限管理。8、系统已经后台管理的基本架构,适合二次开发。注意事项:1、开发环境...