javascript - Backbone 模型未正确调用销毁回调

Question

我快被这件事搞疯了。我真的不知道这里有什么问题。

我有一个称为项目的模型集合，每个项目都有自己的 projectviewitem。

我要执行的任务只是删除属于该集合的所有模型。相应的模型 View 也应该被移除。这是我的做法:

empty: function() {
    for(i=0; i<this.length; i++) {
        var model = this.at(i);
        console.log("script remove: "+model.get('id'));
        model.destroy();
    };

我确保我正在使用 console.log 输出销毁正确的模型，它会给我每个模型 ID。

在项目模型中我有这个销毁函数:

destroy: function() {
    console.log(this);
    console.log("model remove: "+this.get('id'));
    return Backbone.Model.prototype.destroy.call(this);
    },

我再次确保我处理的是正确的模型。我还检查模型的结构以确保回调正确。

projectviewitem 在模型的初始化方法中初始化:

initialize: function() {
    this.view = new ProjectViewItem({model: this});
},

它绑定(bind)到模型:

initialize: function() {
    this.model.bind('destroy', this.remove, this);
    ...

它的销毁方法是:

remove: function() {
    console.log("remove: "+this.model.get('id'));
    return Backbone.Model.prototype.remove.call(this);
},

关于现在的 console.log 输出。

这是清空集合时得到的结果。

script remove: 344
d (model 344 object)
model remove: 344
//here I should get "remove: 340", but I don't. That means the projectviewitem's remove method isn't called, but why?
script remove: 343
d (model 343 object)
model remove: 343
remove: 343
remove: 343
//model 343 makes two callback calls?

因此，所有模型都被删除，但只有一个 View 被删除。我不明白模型 344 如何失去对其 View 的回调以及模型 343 如何获得两个..当我检查对象 (>> d) 时，回调正常。 344有自己的，343也有，而且好像都在指向自己对应的view。

有什么线索吗？

在我解决这个问题之前，我将 (this.view.remove();) 添加到 model.destroy 方法中。它有效，但我绝对想知道为什么绑定(bind)无法正常工作。

Answer 1

这里有几件事可能会导致您的问题，但如果没有更多代码很难确定:

• 您不能使用递增的 for 循环来删除项目(destroy() 将从集合中删除该项目)，因为您正在更改你走的长度。解决此问题的经典方法是向后迭代，而不是向前迭代:

  empty: function() {
      for(i=this.length-1; i>=0; i--) {
          var model = this.at(i);
          console.log("script remove: "+model.cid);
          model.destroy();
      };
  }
  

• 具有 id 的模型上的 .destroy() 方法不会触发 destroy 事件，除非服务器成功响应 (relevant code) .因此，您需要确保您的服务器正在响应 DELETE 请求的 200 响应。

• 如我的评论所述，我不确定您在 View 上调用 Backbone.Model.prototype.destroy.call(this) 是想做什么。我怀疑这是一个拼写错误，无论是在您的帖子中还是在您的代码中，但我不确定它会完成什么。

我希望这些问题中至少有一个是您问题的根源。我有一个工作的 jsFiddle，这里的代码略有修改:http://jsfiddle.net/e8Uct/3/ - 不过它只使用动态创建的模型，所以它不处理服务器回调。

顺便说一句，我个人不喜欢用模型初始化 View 的模式——我宁愿反过来做，让模型完全独立于用户界面。但这确实是一个品味问题。