我有以下两个基于Backbone.js的视图
pg.views.ItemList = Backbone.View.extend({
tagName: "div",
className: "items",
initialize: function() {
_.bindAll(this, 'addOne', 'addSelected')
Items.bind('add', this.addOne);
Items.fetch();
},
// REMOVED
addOne: function(Item) {
console.log($(this.el));
var view = new pg.views.Item({model: Item});
$(this.el).append(view.render().el);
},
addSelected: function(ItemList) {
_.each(ItemList, this.addOne);
return this.el;
},
// REMOVED
});
pg.views.Section = Backbone.View.extend({
tagName: "section",
sectionTemplate: _.template($('#section-template').html()),
events: {
// REMOVED
},
initialize: function() {
_.bindAll(this, 'render', 'close', 'addItemToSection', 'removeItemFromSection');
this.model.bind('change', this.render);
this.model.view = this;
Items = new pg.collections.ItemList;
},
render: function() {
$(this.el).html(this.sectionTemplate(this.model.toJSON()));
this.setContent();
Items.bind('add', this.addItemToSection); // "add" event bind
Items.bind('remove', this.removeItemFromSection); // "remove" event bind
this.addItems();
return this;
},
addItems: function() {
var ids = this.model.get('items');
var view = new pg.views.ItemList;
var items = _.map(ids, function(id){ return Items.get(id); });
$(this.el).append(view.addSelected(items));
},
// FUNCTIONS REMOVED
setContent: function() {
var title = this.model.get('title');
this.$('.title').text(title);
this.title = this.$('.title-input');
this.title.val(title);
},
addItemToSection: function(Item) {
console.log(this.model.get('title'));
// REMOVED
},
removeItemFromSection: function(Item) {
console.log(this.model.get('title'));
// REMOVED
}
});这就是我遇到的问题。
我有一个视图，用户在其中创建了两个部分，假设它们分别称为“section1”和“section2”。
下面是我观察到的奇怪行为：
1.当用户位于“section1”中并添加项时，将触发“add”绑定事件，这将导致“section2”写入控制台。
1.当用户位于“section1”中并添加项时，将触发“remove”绑定事件，这将导致“section1”写入控制台。
1.当用户位于“section2”中并添加项时，将触发“add”绑定事件，这将导致“section2”写入控制台。
1.当用户位于“section2”中并添加项时，将触发“remove”绑定事件，这将导致“section2”和“section1”分别写入控制台。
如果我使用“this.addItemToSection”在“pg.views.Section”视图中绑定“add”，它是否应该只调用该示例中的“addItemToSection”块？
我能看到的唯一一行“重定义”“this”是“pg.views.ItemList”的initialize块中的“add”绑定。如果这行是罪魁祸首，我如何防止它在“section1”的“add”绑定上重定义“this”？
1条答案
按热度按时间lvjbypge1#
我认为这是一个全球性的问题，一语双关;）您正在调用
Items上的所有内容，而Items首先用var声明-（不好的做法）意味着它将绑定到窗口对象。并且您在另一个视图中使用了相同的变量引用！因此，这两个变量都将被调用，因为它们引用了相同的对象！！！！通过绑定到'this'，您可以拥有任意多的'local'示例。尝试以下更改，我想它们应该会起作用。