1

我有一个创建列表的主视图。这个视图有一个点击事件来“加载更多的项目”。
我有两个扩展主视图的子视图。
我的问题是，当我单击一个视图“加载更多”按钮时，它会影响另一个视图（如果之前加载）。我知道在初始化另一个视图之前我必须关闭视图，但是由于我的视图正在扩展主视图，因此此方法不起作用（它会关闭主对象，并且其他子视图不会初始化）：

Backbone.View.prototype.close = function(){
  this.remove();
  this.unbind();
}

我的主视图：

App.Views.List = Backbone.View.extend({
    events: {
        'click .load-btn' : 'loadMore'
    },
    loadMore: function(e)
    {
        this.collection.increase().fetch({
            add: true
        });
        e.preventDefault();
    }  
}

注意 .increase 是增加 api 参数的自定义方法。

子视图：

App.Views.Projects = App.Views.List.extend({
    initialize: function()
    {
        this.itemView = App.Views.Project;
        this.collection = new App.Collections.Projects();
        this.parent('initialize');
    },
    render: function()
    {
        this.template = _.template(App.Tpl.get('projects.list'));
        this.parent('render');
    }
});

请注意， .parent 是调用主视图方法的自定义方法。
因此，当我单击视图中的加载更多按钮时，如果已经初始化，它会尝试在从主视图扩展的所有视图上调用 loadMore 方法。

我应该怎么办？

4

2 回答 2

1

App.Views.Projects扩展App.Views.List并且不定义事件，因此它是从父视图继承的。这意味着.load-btn项目视图中的所有元素都设置了处理程序。

也许你可以通过在项目视图中添加一个空的事件哈希来解决这个问题，即。

App.Views.Projects = App.Views.List.extend({
  events: {},
  initialize: function()
  ...
});
于 2012-03-14T15:04:13.893 回答
0

使用 e.stopPropagation() 而不是阻止默认值。这帮助我解决了类似的问题。

于 2012-03-14T18:12:39.030 回答