通过前几章的定义，发现所有的组件可以拥有共同的方法，例如，设置渲染，设置组件的id、name，以及曾经使用的event方法，在这里也可以得以使用，因此我删除了之前的Event类，在基类中添加了event的触发事件，完成了渲染完成组件后执行设定好的方法，代码如下：
/**
* @Author Dike.Li
* @Date 2015/8/31
* @class BaseClass
* @public
* @Description Basic classes for all components,have basic methods.
*/
define(function (require) {
var baseClass = (function (temp, option, $) {
var me = this;
/**
* 根据模板获取jquery对象
*/
var tempObj = $(temp);
/**
* 依赖关系变量
*/
var quite = null;
/**
* 组件样式变量
*/
var cls = null;
/**
* 触发事件
*/
var handle = (function (option, tempObj) {
/**
* 设置事件
*/
if (typeof(option.listeners) !== ‘undefined‘) {
for (var listenerName in option.listeners) {
if (listenerName === ‘onReady‘) {
option.listeners[listenerName](me);
continue;
}
tempObj.on(listenerName, option.listeners[listenerName]);
}
}
});
/**
* 在option中设置了render属性的则进行翻译后的模板添加
*/
if (typeof(option.render) !== ‘undefined‘) {
option.render.append(tempObj[0]);
handle(option, tempObj);
}
/**
* 设置组件是否存在add子元素的功能
* @param isHave value: true or false
*/
me.setIsHaveAdd = (function (isHave) {
if (isHave) {
/**
* 在组件内部进行渲染
*/
if (typeof(option.items) !== ‘undefined‘) {
option.items.forEach(function (obj) {
if (typeof(obj.getEl) !== ‘undefined‘) {
tempObj.append(obj.getEl());
} else {
tempObj.append(obj);
}
});
}
/**
* 将外部内容添加到本组件中
*/
me.add = (function (obj) {
if (typeof(obj.getEl) !== ‘undefined‘) {
tempObj.append(obj.getEl());
} else {
tempObj.append(obj);
}
});
/**
* 将外部一组内容添加到本组件中
*/
me.addItems = (function (objs) {
objs.forEach(function (obj) {
if (typeof(obj.getEl) !== ‘undefined‘) {
tempObj.append(obj.getEl());
} else {
tempObj.append(obj);
}
});
});
}
});
/**
* 设置依赖关系
*/
me.setQuote = (function (array) {
quite = array;
});
/**
* 获取组件的依赖项
*/
me.getQuote = (function () {
return quite;
});
/**
* 提供获取模板的方法
*/
me.getTemp = (function () {
return temp;
});
/**
* 获取temp jquery object
*/
me.getTempObj = (function () {
return tempObj;
});
/**
* 获取模板对象
*/
me.getObj = (function () {
return tempObj;
});
/**
*获取对象Element内容
*/
me.getEl = (function () {
return tempObj[0];
});
/**
* 注册事件
* @param name
* @param fn
*/
me.on = (function (name, fn) {
tempObj.on(name, fn);
});
/**
* 获取元素ID
* @return id
*/
me.getId = (function () {
return typeof(tempObj.attr(‘id‘)) === ‘undefined‘ ? null : tempObj.attr(‘id‘);
});
/**
* 获取元素NAME
* @return name
*/
me.getName = (function () {
return typeof(tempObj.attr(‘name‘)) === ‘undefined‘ ? null : tempObj.attr(‘name‘);
});
/**
* 判断是否定义
* @param obj
* @return boolean
*/
me.isDefine = (function (obj) {
return typeof(obj) === ‘undefined‘ ? false : true;
});
/**
* 设置组件样式
* @param obj is array [‘cls1‘,‘cls2‘]
*/
me.setCls = (function(obj){
cls = obj;
});
/**
* 获取组件依赖的组件样式
*/
me.getCls = (function(){
return cls;
});
});
return baseClass;
});
原文：http://my.oschina.net/u/2349331/blog/500266