8

我正在声明这样的视图：

var VirtualFileSelectorView = Backbone.View.extend({
    selected: function() {
        console.log("selected function");
    },

    initialize: function() {
        // Shorthand for the application namespace
        var app = brickpile.app;
        // bind to the selected event
        app.bind('selected', this.selected, this);
    }
});

然后我实例化这个视图的两个实例，就像你在这里看到的那样：http: //cl.ly/H5WI

The problem is that when the event selected is fired the function selected is called twice?

4

2 回答 2

3

阅读评论线程后，我想我已经了解如何帮助您解决问题：

在您的代码中，两个视图都在侦听同一个全局事件，因此它们都将同时响应，并且您希望能够selected()独立触发每个视图。

执行此操作的常用方法是将 View 与 Model 关联，并且 View 正在侦听该 Model 上的事件，因此为一个 Model 触发的事件只会影响与其关联的 View。

此模式如下所示：

// code simplified and not tested
var MyView = Backbone.View.extend({
  initialize: function( opts ){
    this.model = opts.model;
    this.model.on( "selected", this.selected, this );
  },

  selected: function( model ){
    // ...
  }
})

var oneModel = new MyModel();
var oneView = new MyView({ model: oneModel });

selected现在您只需要在需要时在每个模型上触发事件。

更新

这种模式非常常见，Backbone 会View.model为您关联参考，因此您可以View.initialize像这样实现：

initialize: function(){
  this.model.on( "selected", this.selected, this );
}
于 2012-06-04T17:43:49.680 回答
1

正如您声明的两个实例，VirtualFileSelectorView您有两个选定事件的观察者。

即使您重用旧 View 实例的引用来引用新 View 实例，旧实例仍然存在，因为仍然有指向它的引用。

这是 Backbone 中一个非常普遍的问题，我认为人们开始称其为“ghosts Views”。

要解决这个问题，您必须处理View绑定unbind的所有事件，在您的示例中，您可以执行以下操作：

app.virtualFileSelectorView.off( null, null, this );

Derick Bailey 有一篇关于这件事的优秀帖子。

另外，怀着谦虚的态度，我想链接到我所做的一项关于这件事的研究，以试图理解这种顽强的行为。

于 2012-06-03T20:38:18.163 回答