如何绑定子视图处理事件的情况下在父视图

Question

我有以下的骨干视图的：

var ParentView = Backbone.View.extend({ 
    events: { 
     "contextmenu .child-view" : "handleChildView" 
    }, 

    initialize: function() { 
     // create child view 
     var child = new ChildView; 
    }, 

    handleChildView: function() { 
    } 
}); 

var ChildView = Backbone.View.extend({ 

    initialize: function() { 
     this.el.addClass('child-view'); 
    } 
}); 

我需要处理在handleChildView处理childView的contextmenu事件。但我需要参考childView和目标DOM元素。

我该怎么做？

Answer 1

我通常会尽量避免。我认为这是一种反模式，因为我相信每个视图只应该处理它自己的事件。

当有需要的视图之间通知事件，我用的是事件总线模式（发布/订阅）

看到这个答案，我早些时候发布：

Call a function in another Marionette.ItemView

这是相似的。

您应该在您的应用中定义一个事件总线。 而在你ChildView，当事情发生时（如点击）

var ChildView = Backbone.View.extend({ 
    events: { 
    'click': 'handleClick' 
    }, 
    handleClick: function() { 
    //publish event 
    EventBus.trigger('childViewClicked', [anything you wanna pass]); 
    } 
}); 

，并在你的父视图发布事件，订阅此事件：

var ParentView = Backbone.View.extend({ 
    initialize: function() { 
    //subscribe events: 
    EventBus.on('childViewClicked', this.handleChildView, this); 
    }, 

    handleChildView: function ([params you wanna receive]) { 
    } 
}); 

Answer 2

这是否适合您？

var ParentView = Backbone.View.extend({ 
    events: { 
     "click .child-view .contextmenu" : "handleChildView" 
    }, 

    initialize: function() { 
     // create child view 
     var child = new ChildView; 
    }, 

    handleChildView: function() { 
    } 
}); 

var ChildView = Backbone.View.extend({ 
    className:'child-view' 
    , initialize: function() { 
     this.el.addClass('child-view'); 
    } 
}); 

您可能需要呈现父视图中的子视图（在DOM）