backbone remove view删除el

swe*_*edo 24 javascript jquery backbone.js backbone-views

我正在创建一个单页面应用程序,我对骨干很新.我在创建使用相同wrapper-div的多个视图时遇到问题.

我的设置:

我为所有视图添加了一个close函数:

Backbone.View.prototype.close = function(){
    this.remove();
    this.off();
    if (this.onClose){
        this.onClose();
    } 
}
Run Code Online (Sandbox Code Playgroud)

我有一个wrapper-div,我想渲染视图,删除它们并渲染新的视图.所以我的SetupView看起来像这样:

app.SetupView = Backbone.View.extend({
    el: '#my_view_wrapper',
    ...
});
Run Code Online (Sandbox Code Playgroud)

从我交换视图的函数我关闭当前(打开)视图,如下所示:

var v = this.model.get('view');
v.close();
Run Code Online (Sandbox Code Playgroud)

我的问题是我有多个视图使用相同的wrapper-div.但是当我关闭一个视图时,这个wrapper-div似乎被删除了,我尝试创建的下一个视图找不到这个div.

我想有一个简单的解决方案?我想重用相同的包装器,只删除其中的视图,而不是包装器本身.

Mar*_*cus 25

正如添加(供以后参考):另一个选项是覆盖子视图,remove以便它只是清空$el而不是删除它.例如.

remove: function() {
      this.$el.empty().off(); /* off to unbind the events */
      this.stopListening();
      return this;
}
Run Code Online (Sandbox Code Playgroud)

我个人更喜欢这个,因为它不需要插入没有实际用途的包装元素.

  • 我还要添加`this.$ el.empty().off()`以确保所有事件都被关闭. (6认同)

小智 17

在您的方案中,不要使用现有的DOM元素作为"el"值.Backbone将为您创建元素.实例化视图时,可以执行以下操作将其附加到现有的包装元素.

$(viewName.render().el).appendTo('#my_view_wrapper');
Run Code Online (Sandbox Code Playgroud)