backbone.js - 在信息栏中显示从侧边栏中选择的模型

Question

我正在开发一个右侧有侧边栏的应用程序。显示集合。集合的每个模型都有select行为。

在页面的顶部中心，我有一个独立的主干视图，其作用类似于“信息栏”，当我在侧边栏中选择一个视图时，该视图应该更新它的信息

我该怎么做？我认为侧边栏中的每个视图都应该具有带有模型参数的“选定”事件，我的问题是如何在 Backbone.js 的信息栏视图中收听这种变化？

Answer 1

这听起来像是事件聚合器模式可以很好地服务的东西。Derick Bailey 就此事发表了一篇非常好的文章，您可以在此处阅读。

事件聚合器模式

我扩展了我的 Backbone.View 以便所有视图都可以像这样使用事件聚合器对象。

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

基本上，当您选择模型视图时，您的 view.eventAggregator 将触发一些自定义事件。

sidebarView.eventAggregator.trigger('selected', this.model);

或类似的东西。使用 Backbone 事件，您可以通过触发函数将参数传递给事件侦听器。在上面的示例中，我通过特定事件传递了模型。

在您的主视图中，您将监听此事件。

mainView.eventAggregator.on('selected', myFunction, this);

myFunction: function(model) {
    // Some code to execute - model is available through param
}

这是一个非常有用的模式。只是不要忘记在关闭 mainView 时取消绑定事件。:-)