Question

我正在尝试通过几个文档阅读Backbonejs。这是一个MVC 客户端框架。在视图中我们编译模板和渲染它们（将它们附加到DOM，或进行一些操作）。骨干有下划线js的依赖关系，这是模板化的东西。

使用Bbone时，操纵视图el就会出现。我的对el的理解是它引用了DOM Object。如果不 dom对象被分配给它，它假定空div 。

var choose_view = new SearchView（{el：$（“＃choose_me”）}）;

所以在上面的例子中，将调用id为choose_me的div，何时调用choose_view。到目前为止这么好，但是有什么在年代表中发生的事情，我无法得到，也是有任何冗余，请阅读查询的评论：

// the div with id search_container will be picked up by el
<div id="search_container"></div>

<script type="text/javascript">
    SearchView = Backbone.View.extend({
        initialize: function(){
            this.render();
        },
        render: function(){
            //1. Compile the template using underscore, QUESTION: **what does this mean**?
            var template = _.template( $("#search_template").html(), {} );
            //2. Load the compiled HTML into the Backbone "el"
            this.el.html( template );
        }
    });
    // QUESTION: **When in 2. we have already mentioned, el, can we not over there
    provide the div element?**
    var search_view = new SearchView({ el: $("#search_container") });
</script>

<script type="text/template" id="search_template">
    <label>Search</label>
    <input type="text" id="search_input" />
    <input type="button" id="search_button" value="Search" />
</script>

Answer 1

问题1

编译模板意味着您将获得一个模板函数，您可以将其作为模板函数的参数传入数据对象。这样，您可以使用不同的数据对象多次评估模板函数，而它只编译一次。

compiledTemplate = _.template( $("#search_template").html());
this.el.html(compiledTemplate(data));
another.el.html(compiledTemplate(otherData));

在上面的示例中，您编译模板一次，然后使用两次。在您提供的代码中，您编译并同时使用模板

所以

_.template( $("#search_template").html()); // Create a template function, the result is a function that you can call with a data object as argument
_.template( $("#search_template").html(), data); // Create a template function and call it directly with the data object provided, the result is a string containing html

参考：http://underscorejs.org/#template

问题2

您可以直接提供div元素，但el是帮助您检索视图的根元素，所有DOM事件都将委派给该元素。

如骨干文件中所示

如果您想创建一个引用已经存在的元素的视图 DOM，作为选项传递元素：new View({el: existingElement})

参考：http://backbonejs.org/#View-el

在backbonejs中编译模板意味着什么呢？

1 个答案: