backbone.js:无法从父视图触发自定义视图并让子视图绑定到它

时间:2012-03-15 02:36:13

标签: backbone.js backbone-events

我有一个父骨干视图,它在其render方法中创建一个新的骨干视图。

var appView = Backbone.View.extend({
    ...
    render: function() {
        preview = new previewDataView({model: model, el: $el.find('.preview-container')});
    }
});

我希望能够在appView中触发自定义事件并将previewDataView绑定到它 - 这可能吗?当我尝试时,previewDataView没有收到此事件。想法?

1 个答案:

答案 0 :(得分:2)

我认为你可以通过两种方式实现这一目标。首先,将父级传递给子视图。其次,创建一个处理事件触发的eventAggregator。

FIRST:

您可以将appView作为选项传递给previewDataView。

preview = new previewDataView({ // your options, 'parent':this });

在您的previewDataView中,您将绑定到父自定义事件,如下所示:

this.parent = this.options.parent;
this.parent.bind('eventName', this.onEvent, this);

第二:(刚刚学会了这种技术)

您可以创建一个eventAggregator,帮助您的视图订阅和取消订阅彼此相关的事件。这是一个很好的答案,可以在Stack上详细解释:fire an event from one view to another in backbone

在评论中,@ Brian Genisio更进一步将其包含在他的代码中:

Backbone.View.prototype.eventAggregator = _.extend({}, Backbone.Events);

在代码的开头运行此操作,每个视图都可以访问eventAggregator,它将成为您需要跨视图触发和接收的事件的中心枢纽。你会这样使用它:

// Parent View
this.eventAggregator.trigger('someEvent');

// Child View
this.eventAggregator.bind('someEvent', this.function, this);

通过这种方式,您无需在需要相互访问的视图之间显式传递引用以进行事件触发和侦听。这种方法对我来说非常方便。 : - )