【问题标题】:Automatically extend event from a base view从基本视图自动扩展事件
【发布时间】:2011-10-12 22:05:33
【问题描述】:

我有一个用于所有视图的基类,然后在应用程序的每个部分,比如配置文件,我也有一个基类。这样,共享模板和属性可以在我的应用程序中的多个级别上使用。

我知道,如果您将 Backbone 视图中的事件属性设置为函数而不是对象字面量,它将为您实例化,但我不确定如何利用它来发挥我的优势。我的问题是,自动扩展在基本视图中创建的事件的最佳方式是什么。

我知道一种可能性,我在视图初始化时,获取基事件类并将我的当前事件扩展到它,但它似乎有点 hacky,我必须在每个视图上复制此代码。如果您知道更好的方法,请分享。

谢谢。

【问题讨论】:

  • 您可能想查看这些帖子/链接(可能重复):stackoverflow.com/questions/6257405/… 另一个:stackoverflow.com/questions/6968487/… 外部站点:kalimotxocoding.blogspot.com/2011/03/…
  • 您好 Nupal,非常有效的回复,感谢您进行了比我做得更好的检查。您发布的两个 stackoverflow 链接有一个很好的答案,每个都与下面提供的不同。我将把它们都添加在那里,并使其成为这个特定问题的最终来源(其他问题更广泛)。此外,kalimotxocoding.blogspot.com 博客条目简直太可怕了,需要破解backbone.js 核心,实际上并不能解决任何问题。感谢您的意见。

标签: backbone.js


【解决方案1】:
var ParentView = Backbone.View.extend({
    'events': {
        'click .parent-something': "onParentSomethingClick"
    }
}); 

var ChildView = ParentView.extend({
    'events': _.extend({
        'click .something': 'onSomethingClick',
    }, ParentView.prototype.events)
});

这不是什么都不做,但这是我迄今为止见过的最简单的方法。
我还以我一直在使用的另一种方式创建了一个要点:https://gist.github.com/1271041

【讨论】:

  • 您通过 github 链接提供的“父”功能非常棒。我肯定会用你的替换我当前的 _super 实现。谢谢!!
  • 你不想把你的对象传递给 _.extend() 吗?即克隆然后用新事件覆盖超类的事件?这样你就可以用子功能覆盖超级功能,这是一种更熟悉的继承方法。
【解决方案2】:

这是我在子视图中扩展父视图事件的方法:

var ParentView = Backbone.View.extend({

        events: {
            'click .link': 'onLinkClick'
        }
});

var ChildView = ParentView.extend({

        events: function(){
            return _.extend({
                'click .something': 'onSomethingClick',
            }, this.constructor.__super__.events);
        }
});

注意:这仅适用于 Backbone 0.5.3。在该版本之前,您无法将事件定义为函数。

【讨论】:

  • 谢谢约翰尼奥。我听说过非标准但无处不在的__proto__,但从未听说过JavaScript 中的__super__。这是 Backbone 核心的新增功能还是现代浏览器中的新功能?
  • super 由 Backbone 核心添加,映射到继承类的原型。
【解决方案3】:

我相信 JohnnyO 的回答是最好的。但是我遇到了另外两种方法,我将它们粘贴在这里。

遗憾的是,没有不需要在每个新视图中额外手写代码的“自动”解决方案,但它就是这样。

 ChildView = ParentView.extend({
     name: 'ChildView',
     events: {
     },
     constructor: function(){
        this.events = _.extend( {}, ParentView.prototype.events, this.events );
        console.debug( this.events );
        ParentView.prototype.constructor.apply( this, arguments );
     },
     someFunc: function(){
         console.debug('someFunc; this.name=%s', this.name);
     } 
 });

由保罗 - backbone.js view inheritence. `this` resolution in parent

我不知道您可以在 Backbone.view.extend 中提供构造方法。很高兴知道。

 var GenericView = Backbone.View.extend({

   genericEvents: { 'click .close': 'close' },

   close: function() { console.log('closing view...'); }

 });

 var ImplView = GenericView.extend({

   events: { 'click .submit': 'submit' },

   initialize: function(options) {
     // done like this so that genericEvents don't overwrite any events
     // we've defined here (in case they share the same key)
     this.events = _.extend(this.genericEvents, this.events);
     this.delegateEvents()   
   } 
});

由 rulfzid - Sub Class a Backbone.View Sub Class & retain events

我已经设想(并拒绝)了这种方法,但是这种方法有一个额外的转折,即把你的基本事件称为别的东西,这样“genericEvents 不会覆盖任何事件”,正如作者所说。除非他在谈论你在两个事件对象中传递的两个事件的某种类型,我不确定他在说什么,我只是使用 proto 或原型来引用父母事件。但同样,很高兴知道。

【讨论】:

  • 您可以在 ChildView 的定义中内联 _.extend( {}, ParentView.prototype.events, { 'click':'close' } )。那么就不需要构造函数了。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-07-25
  • 1970-01-01
  • 1970-01-01
  • 2022-01-09
  • 1970-01-01
相关资源
最近更新 更多