未指定预定义 el 而不呈现的主干视图

Backbone views not rendering without predefined el specified

本文关键字:视图 预定义 el 未指定      更新时间:2023-09-26

我正在尝试做的是创建可以在不删除父元素的情况下删除的视图。我发现当我直接在视图上设置 el 属性时,当我.remove()它时,父元素也会被删除。

我尝试创建一个仅带有tagName的视图,认为它会将其弹出body,但事实并非如此,它似乎根本没有将其插入页面。

在不删除实际包含元素的情况下从元素中完全删除视图的正确方法是什么?

我不确定"父元素"是否el.

var DemoView = Backbone.View.extend({
    el: "#container",
    events: {
        "click button": "removeSelf"
    },
    render: function () {
        this.$el.append("<button>remove</button>");
        return this;
    },
    removeSelf: function () {
        this.remove();
    }
});
new DemoView().render();

如果点击按钮,#container就会被删除;如果你不想删除#container,就不要设置el属性,DemoView会创建一个空div,就像这样:

var DemoView = Backbone.View.extend({
    events: {
        "click button": "removeSelf"
    },
    render: function () {
        this.$el.append("<button>remove</button>");
        return this;
    },
    removeSelf: function () {
        this.remove();
    }
});
var demoView = new DemoView();
$("#container").append(demoView.render().el);

现在,如果您单击该按钮,演示视图将被删除,但#container不会。

如果不指定默认 el,则必须稍后将它们附加到元素中,如 view.render().$el.appendTo('body') . body 可以是指向容器元素的任何其他选择器。