主干视图：从父级继承和扩展事件

javascript backbone.js backbone-events

2022-08-30 05:16:07

Backbone的文档指出：

events 属性还可以定义为返回事件哈希的函数，以便更轻松地以编程方式定义事件，以及从父视图继承事件。

如何继承父级的视图事件并对其进行扩展？

父视图

var ParentView = Backbone.View.extend({
   events: {
      'click': 'onclick'
   }
});

儿童视图

var ChildView = ParentView.extend({
   events: function(){
      ????
   }
});

答案 1

一种方法是：

var ChildView = ParentView.extend({
   events: function(){
      return _.extend({},ParentView.prototype.events,{
          'click' : 'onclickChild'
      });
   }
});

另一个是：

var ParentView = Backbone.View.extend({
   originalEvents: {
      'click': 'onclick'
   },
   //Override this event hash in
   //a child view
   additionalEvents: {
   },
   events : function() {
      return _.extend({},this.originalEvents,this.additionalEvents);
   }
});

var ChildView = ParentView.extend({
   additionalEvents: {
      'click' : ' onclickChild'
   }
});

检查事件是函数还是对象

var ChildView = ParentView.extend({
   events: function(){
      var parentEvents = ParentView.prototype.events;
      if(_.isFunction(parentEvents)){
          parentEvents = parentEvents();
      }
      return _.extend({},parentEvents,{
          'click' : 'onclickChild'
      });
   }
});

答案 2

士兵.飞蛾的答案是一个很好的答案。进一步简化它，你可以做以下事情

var ChildView = ParentView.extend({
   initialize: function(){
       _.extend(this.events, ParentView.prototype.events);
   }
});

然后，只需以典型方式在任一类中定义事件即可。