0

我有一个模型，它有两个属性，它们是集合：

MainModel= Backbone.Model.extend({
  defaults: {
     colOne:undefined,
     colTwo:undefined
  },

  initialize:function() {
    this.set({colOne:new InnerCollection()});
    this.set({colTwo:new InnerCollection()});
  }
});

InnerCollection= Backbone.Collection.extend({ 
  model: InnerModel, 
});

InnerModel= Backbone.Model.extend({
      ...
});

我发现项目 ( InnerModels) 没有从 Collections colOne 和 colTwo 中正确删除。我在 Stackoverflow 上发现了一个问题，似乎解释了问题的原因并提出了解决方案。toJSON()我在我的模型上提供了一个重写的实现：

MainModel= Backbone.Model.extend({
      defaults: {
         colOne:undefined,
         colTwo:undefined
      }

      initialize:function() {
        this.set({colOne:new InnerCollection()});
        this.set({colTwo:new InnerCollection()});
      },

      toJSON: function() {
        _.extend(this.attributes, {colOne: this.get('colOne').toJSON()});
        _.extend(this.attributes, {colTwo: this.get('colTwo').toJSON()});
        return this.attributes;
      },
    });

问题 #1 -我不太确定为什么这会解决问题或我为什么要这样做。

问题 #2 -当我尝试使用集合colOne或colTwo在我的视图中时，它会导致错误。堆栈跟踪是：

Uncaught TypeError: Object [object Object],[object Object] has no method 'bind'
Backbone.View.extend.initializeinteractiveviews.js:646
Backbone.Viewbackbone.js:1147
childbackbone.js:1392
Backbone.View.extend.renderinteractiveviews.js:441
Backbone.View.extend.renderinteractiveviews.js:619
(anonymous function)interactiveviews.js:766
_.each._.forEachunderscore.js:76
wrapper.(anonymous function)underscore.js:961
Backbone.View.extend.renderinteractiveviews.js:758
Backbone.View.extend.renderinteractiveviews.js:452
Backbone.View.extend.renderinteractiveviews.js:619
(anonymous function)interactiveviews.js:766
_.each._.forEachunderscore.js:76
wrapper.(anonymous function)underscore.js:961
Backbone.View.extend.renderinteractiveviews.js:758
Backbone.View.extend.renderinteractiveviews.js:443
Backbone.View.extend.renderinteractiveviews.js:619
window.AppView.Backbone.View.extend.renderindex.html:73
window.AppView.Backbone.View.extend.initializeindex.html:47
Backbone.Viewbackbone.js:1147
childbackbone.js:1392
(anonymous function)index.html:97
jQuery.Callbacks.firejquery-1.7.2.js:1075
jQuery.Callbacks.self.fireWithjquery-1.7.2.js:1193
jQuery.extend.readyjquery-1.7.2.js:435
DOMContentLoaded

bind只是我尝试使用该系列的第一个地方colOne：

// this.collection is colOne
this.collection.bind('myEvent', this.myEventHandler);

我没有任何语法错误，所以我不确定我的 toJSON 方法是如何破坏的。

更新

这不是 Backbone.js 的问题。我遇到的问题归结为没有解除与事件的绑定。因此，尽管一旦集合为空，特定的 View 就不再可见，但它是由添加新项目的事件触发的。这就是为什么每次我从 View 事件中删除一个项目时，集合的计数都会增加。

4

1 回答 1

0

这不是 Backbone.js 的问题。我遇到的问题归结为没有解除与事件的绑定。

使用 Item 填充 Collection 的 View 不再可见，但仍绑定到触发将 Item 添加到 Collection 的 UI 事件。事件的顺序大约是：

Event XYZ triggers creation of View2
View2 creates Item and adds to Collection.

（collection.length现在 1）。

...Item removed from Collection.

（collection.length现在为 0）。

If Collection empty remove `View2`.
View2 removed.

此时如果再次触发Event XYZ，将创建两个View2实例，因此将2个项目添加到集合中。即使从 Collection 中删除了一个 Item，每次删除第一个 Item 时长度都会增加 1。

总结：如果您$(myView).remove()在代码中的任何地方都使用了事件/绑定，请检查您是否从事件中取消绑定。

于 2012-04-14T21:51:32.210 回答