javascript - 使用尚未创建的 el 的 Backbone ？

Question

我正在使用 Backbone 构建一个网页应用程序。

我的主视图依赖于模板，该模板将根据 URL 替换我页面的主体部分，但由于我必须为该 View 提供一个“el”，我希望它是模板本身，将被插入“渲染”或“初始化”方法中的 DOM。

但是当我调用 new MyMasterView 时，el 是未定义的，因为它在实例化时不存在于 DOM 中。

我该怎么做？

我发现的唯一修复方法是将 el 设置为我替换内容的现有 DOM，并在渲染中调用 .remove().append(the_template)，但我不确定这是最好的方法。

Answer 1

我们可以考虑这样一种场景，您在 DOM 中有以下 div

<div id="existing">

</div>

此 div 可以是您想要插入 View 生成的 html 的任何其他元素。

假设您有以下模板，

<div id="inside_template">
  <!-- content of the template goes here -->
</div>

您可以将 existing 指定为 View 的 el，因为它已经存在于 div 中。您将遇到的唯一问题是，如果它有一些标签，如 body 或其他东西，那么如果您在清除 View 时将其从 View 中删除(以防止内存泄漏)，它将从可能不需要的 dom。

一个解决方案是，将 existing 指定为 el，在 el 中呈现 View 的 html，然后调用 setElement在将模板 html 附加到 DOM 之后，例如，

render : function() {
  this.$el.html(this.template());
  this.setElement("#inside_template");

  // another render method content
}

这将做的是，它将 View 的 el 从 existing(或任何其他 DOM 元素)更改为 inside_template。因此，在删除 el 时，inside_template 元素将被删除，而 existing 元素将保持在 DOM 中。