将backbone.js视图附加到现有元素与将el插入DOM中进行对比。

14 浏览
0 Comments

将backbone.js视图附加到现有元素与将el插入DOM中进行对比。

我正在实现我的第一个非教程的Backbone应用程序，并对使用backbone.js的一个方面不太满意，即将视图的渲染el注入到DOM中与使用现有元素作为el的问题有2个问题。我怀疑我会向你们提供一些“可以教导的时刻”，感谢你们的帮助。

我在网上看到的大多数Backbone View示例都指定了tagName、id和/或className，创建一个与DOM无关联的View，它们通常看起来像这样：

App.MyView = Backbone.View.extend({
    tagName: 'li',
    initialize: function () {
     ...
    },
    render: function () { 
        $(this.el).html();
        return this;
    }
});

但是教程并没有总是解释他们建议如何将渲染后的el插入到DOM中。我看到过几种不同的方式。所以，我的第一个问题是：在哪里调用视图的render方法并将其el插入到DOM中是合适的？（不一定是同一个地方）。我在路由器中看到它被调用，在视图的initialize或render函数中，或者只是在根级别的文档准备好的函数中。 （$(function ()）。我可以想象其中任何一个都可以工作，但是否有正确的方法？

其次，我从一些HTML标记/线框开始，将HTML部分转换为与backbone视图对应的js模板。与其让视图渲染一个未附加的元素并在html中提供一个锚点来插入它，但当只有一个元素用于视图且不会消失时，我觉得使用现有的、被清空的包装元素（通常是div或span）作为el本身更自然。这样，我就不必担心找到将未附加的el插入文档的位置，否则可能会出现如下所示的情况（请注意额外的层次结构）：

所以我的第二个问题的一部分是，对于基本静态的视图，使用页面HTML中的现有元素作为我的视图的el有什么问题吗？这样，我知道它已经在DOM中，处于正确的位置，并且调用render将立即在页面上渲染视图。我会通过将已存在的元素作为'el'传递给我的视图构造函数来实现这一点。这样，对我来说，我就不必担心将其插入到DOM中（使问题1有点无关紧要），并且调用render将立即更新DOM。例如：

对于页面上的静态视图，这是一种可以接受的方法吗？也就是说，只有一个这样的视图，无论什么情况下都不会消失。还是有更好的方法？我意识到根据我使用视图的方式可能会有不同的做事方式（即，在路由器中，在父视图中，在页面加载时等），但现在我正在看初始页面加载的用例。

谢谢

0