Backbone.js - 从一个视图绑定到另一个视图？答案

【问题标题】：Backbone.js - Binding from one view to another?Backbone.js - 从一个视图绑定到另一个视图？
【发布时间】：2011-10-19 07:49:35
【问题描述】：

我有一个主应用视图，标题中有一个过滤器菜单。单击它时，我想在单独的新闻提要视图中过滤内容。但我不知道如何将一个视图中的点击事件（并传递类数据）绑定到另一个视图中的函数。

我怎样才能做到这一点？

【问题讨论】：

标签： view backbone.js javascript-framework javascriptmvc

【解决方案1】：

Backbone 中的所有内容都继承自 Backbone.Events，因此您可以从任何地方触发和绑定事件 (docs for Backbone.Events)：

var View1 = Backbone.View.extend();

var View2 = Backbone.View.extend({
    eventHandler: function(data) {alert(data)}
});

var v1 = new View1;
var v2 = new View2;

v1.bind('hello-world-event', v2.eventHandler)
v1.trigger('hello-world-event', 'Hello World!')

请注意，在此示例中，当调用 v2.eventHandler 时，'this' 将引用 v1。更多信息请参见主干网docs。

【讨论】：

如果我在同一个 .js 文件中没有视图的两个实例变量怎么办？
好吧，就应用程序结构而言，正如 idbentley 指出的那样，您有很多选择。例如，您可以有一个类似“控制器”的应用程序视图，它实例化一些子视图、侦听事件并相应地进行调度
示例不遵循问题。您在同一个视图上触发事件，它正在“捕获”事件。

【解决方案2】：

有很多方法可以实现这一点，但您可能希望创建一个模型对象，该对象在两个视图之间共享。然后在视图一中点击“点击”，更新模型对象，并将视图二中的“on change”绑定到模型对象。

基本上，您可以将两个视图设置为与模型对象保持同步，对对象的任何更改都会导致视图发生更改。

【讨论】：

+1 这绝对符合Backbone的理念。
+1 似乎要走的路，但是如果我已经在视图中使用了模型怎么办？如果我想要交互的视图是父视图和子视图（子视图嵌套在父视图中）怎么办？
我还发现这里提到的事件聚合器也很好用 - lostechies.com/derickbailey/2011/07/19/…
Derick Bailey 重新访问了事件聚合器 - lostechies.com/derickbailey/2012/04/03/…
我不喜欢这个解决方案。它在组件之间创建紧密耦合。这被认为是反模式。