骨干視圖-跨組件通信

Question

var BaseView = Backbone.View.extends({
});
var ComponentView = BaseView.extends({
});
var ChildView1 = ComponentView.extends({
});
var ChileView2 = ComponentView.extends({
});

我想在ChildView1和ChileView2.之間進行跨組件通信ChileView2.

我想在parent(ComponentView)有a _.extend({}, Backbone.Events) obj。

我在一些示例中看到了如下內容

var ComponentView = BaseView.extends(_.extend({}, Backbone.Events, {
});

PS：我正在使用組件上存在的屬性初始化另一個BackboneView的所有組件

Answer 1

在Backbone中，我更喜歡使用某種發布/訂閱事件模式在視圖之間進行通信。 以最簡單的形式，您的代碼將如下所示：

/* Create an Event Aggregator for our Pub/Sub */
var eventAggregator = _.extend({}, Backbone.Events);

/* Pass that Event Aggregator to our Child Views */
var childView1 = new ChildView1({ "eventAggregator": eventAggregator });

/* From here we can just bind/trigger off of eventAggregator whenever we need */
eventAggregator.bind("tellChild", function(e) { alert(e.message); });
eventAggregator.trigger("tellChild", { "message": "hello" });

注意我們如何創建一個新對象，該對象擴展自內置Backbone.Events並將其傳遞給ChildView1 。 在ChildView或其他引用eventAggregator的內部，您可以綁定/觸發新事件。 但是，這只是冰山一角，因為您將不再需要了解該事件處理程序，無需綁定該事件處理程序並確保您不泄漏內存即可處理。

這里沒有足夠的空間進行深入研究，因此我建議閱讀更多有關Backbone中事件聚合的信息。 我曾經使用過的所有邏輯均來自Derick Bailey在博客文章和他的著作“ Building Backbone Plugins ”（均為出色的信息來源）中寫的工作。 這些最終來自他創建木偶的工作，這是對Backbone的一個很好的稱贊。 如果您不想擔心這些問題，或者只想使用更簡單的API，我建議您使用Marionette或類似的東西來改善您的Backbone Views。