如何防止 backbone remove() 在视图中删除 "el"？

Question

我想在创建新视图之前删除一个视图。但我的要求是 view.remove() 应该删除视图而不是删除 el 元素。话虽如此，我不想设置 tagName 因为它会创建一个不必要的新元素。有什么方法可以从内存中删除视图，同时清除 el 内容？

Answer 1

您可以从抽象视图中覆盖 Backbone 的视图 remove 方法：

remove: function() {
  // this._removeElement();
  this.$el.empty();
  this.stopListening();
  return this;
}

默认源代码：http://backbonejs.org/docs/backbone.html#section-158

Answer 2

我之前用一次性发射器视图解决了这个问题。

确保您的 html 包含用于一次性视图的（class 或 id）锚点： <div class="content-container"></div>

然后制作 LauncherView:

var LauncherView = Backbone.View.extend({
    initialize: function(options) {
        this.render();
    },

    render: function() {
        this.$el.html(this.template());
        return this;
    },

    // inner views will be bound to ".launcher-container" via
    // their .el property passed into the options hash.
    template: _.template('<div class="launcher-container"></div>')
});

然后实例化您的一次性启动器视图：

app.currentLauncherView = new LauncherView({});

并将其附加到您的 DOM 锚点： $('.content-container').append(app.currentLauncherView.el);

然后您可以实例化一个将附加到一次性启动器视图的视图： app.throwAway1 = new DisposableView({el: '.launcher-container'});

然后当你想销毁那个视图时，你可以这样做：

app.throwAway1.off();
app.throwAway1.remove();
app.currentLauncherView.remove();

然后您可以通过实例化一个新的 LauncherView 来创建一个新视图，将其附加到 DOM，并通过将其绑定到“.launcher-container”来显示您的下一个视图。

app.currentLauncherView = new LauncherView({});
$('.content-container').append(app.currentLauncherView.el);
app.throwAway2 = new DisposableView({el: '.launcher-container'});

如何防止 backbone remove() 在视图中删除 "el"？

How do I prevent backbone remove() from removing "el" in a view?

javascript

backbone.js