事件绑定的实现
header组件本身继承至Abstract.View这个类，所以只要设置
this.events = {}
便能以事件代理的方式将事件绑定至根元素，而header的事件一般就是click事件：
复制代码
setEventsParam: function () {
var item, data = this.datamodel.left.concat(this.datamodel.right).concat(this.datamodel.center);
for (var i = 0, len = data.length; i < len; i++) {
item = data[i];
if (_.isFunction(item.callback)) {
this.events[‘click .js_’ + item.tagname] = $.proxy(item.callback, this.viewScope);
}
}
},
这里有一个需要注意的点便是，事件绑定的钩子便是我们的tagname，这个是唯一的，我们会为每个标签动态生成“.js_tagname”的类，以方便事件绑定
老接口的兼容
之前便说了，该组件是一个老组件的翻新，于是各个业务团队已经使用了，比如原来是这样调用的：
复制代码
this.header.set({
title: ‘基本Header使用’,
subtitle: ‘中间副标题’,
back: true,
backtext: ‘取消’,
tel: { number: 1111 },
home: true,
search: true,
btn: { title: “登录”, id: ‘confirmBtn’, classname: ‘header_r’ },
events: {
returnHandler: function () {
console.log(‘back’);
},
homeHandler: function (e) {
}
}
});
而现在我们期望的调用方式是这样的：
复制代码
this.header.set({
left: [],
center: {},
right: [
{ tagname: ‘home’, callback: function () { } },
{ tagname: ‘tagname’, value: ‘value’, data: {}, itemFn: function(){}, callback: function () { } }
]});
这个时候我们应该怎么做呢？当然是不破不立，先破后立，当然是要求业务团队改！！！然后被无情的喷了回来，于是做了接口兼容
翻新老组件，接口兼容是必须的，如果不是底层机制发生颠覆，而颠覆可以带来颠覆性的成绩，接口还是不建议改！
这里上面便是新接口的调用，下面是老接口的调用，效果如下：
