骨干网.js - 如何将非状态"event"从一个视图发送到另一个视图？

Question

假设我有一个应用程序，它有两个连接的视图——主内容区域中的某种表单元素，以及一个存储所讨论表单摘要的"侧边栏"。

我想在文本输入本身和摘要中表示它的视图上创建一个简单的"flash"动画。这两个视图位于DOM树的非常遥远的部分，因此将它们注册为其父视图的子视图并以这种方式将事件冒泡是不现实的。因此，表单字段(一个简单的输入类型="text")具有以下模型

//The model that manages these two views
var InputModel = Backbone.Model.extend({
defaults: {
flash: false
}
})

//The view of the input field in the actual form - its this.model is an instance of InputModel
var InputFormView = Backbone.Model.extend({
events: {
'mousedown': 'clicked'
}
initialize: function() {
this.render();
this.model.on('change:flash', this.flash, this);
},
render: function() {
return this; //The 'el' DOM element is passed to this view on creation
},
clicked: function() {
this.model.set('flash', true);
},
flash: function(model) {
if (model.changed.flash && model.changed.flash === true){
//Do the 'flashing' animation using jQuery animate
} else {
this.model.set('flash', false);
}
}
});

//The summary column view - its this.model is an instance of InputModel
var InputSummaryView = Backbone.Model.extend({
initialize: function() {
this.render();
this.model.on('change:flash', this.flash, this);
},
render: function() {
return this; //The 'el' DOM element is passed to this view on creation
},
flash: function(model) {
if (model.changed.flash && model.changed.flash === true){
//Do the 'flashing' animation using jQuery animate
} else {
this.model.set('flash', false);
}
}
});

这在实践中确实有效。我看到的问题有两个方面：

1. 我的模型中现在有一些属性，这些属性不是关于输入的有用数据。与中一样，"flash"是否为真在语义上不是有用的信息——它与数据的"呈现"严格相关，而不是数据本身的内容，因此应该归为视图
2. flash字段要么会用有用的信息阻塞我的数据库，要么每次保存()时都需要过滤掉它

有什么方法可以避免这个问题吗？让这两种非常遥远的观点在不使用(或至少破坏)他们的共享模型的情况下进行基于事件的交流？

Answer 1

您不想用这些数据污染模型，这是绝对正确的。实际上还有一个更简单的选择：使用事件管理器。创建一个对象，该对象的唯一任务是在应用程序中全局触发和响应事件。令人高兴的是，Backbone.Events可以为您做到这一点，正如文档所建议的：

var dispatcher = _.clone(Backbone.Events);

然后，您可以在视图中执行dispatcher.trigger('flash')和dispatcher.on('flash')。尽管如此，我还是会将该事件重命名为对实际发生的事情更有意义的名称。