Question

我刚开始使用Backbone（和Underscore）JS。我们正在做一个大的iPad HTML5应用程序，它需要在所有客户端工作。项目需要结构，Backbone似乎很合适。似乎没有太多的方式，可以用作一个工具包（特别是因为也需要Underscore）。

我有一个问题。这个HTML5应用程序基本上是一个单页面应用程序。一切都从index.html文件开始。我一直在了解Backbone管理URL片段的方式，我非常喜欢。将路由事件设置为特定模型很容易。

我正在处理的这个HTML5应用程序中有许多嵌套的“页面”层。有三个级别的嵌套。这是JSON数据，这个应用程序使用（我还没有进入本地数据库存储等，但也许我应该？只是想先了解Backbone）。它们是普通的网页，因此，它们只是已经加载到webapp各个部分的内容页面。

我一直在使用观点。我想我有这个概念......用数据填充集合，而View是围绕这个数据集构建的。我理解，对于Model的单个实例，它有一个View可以使用它。然后，当您想要查看模型的Collection时，可以调用一个View，它将迭代Collection并调用每个模型的View。

抱歉，我知道我可能没什么意义！

但基本上，我看到Backbone Views用于为单个Model生成HTML，用于模型的Collection ...所以这是为页面的各个部分排序的所有小视图，但是对于一个View来说是一个什么样的整页？假设这个HTML5应用程序有一个基本模板，但是webapp的不同页面需要不同的整个页面布局，以便他们可以看看它们应该如何？你可以做这种事吗？基本上有一个View进行Ajax调用以获取整个页面模板？

下面的示例是一个View，当URL位于应用程序的根目录时，它将从主构造函数调用。我想设置各种各样的视图，当用户处于各种URL时，我的应用程序需要显示这些视图。加载像我这样的整个Ajax模板是错误的吗？还有哪些方法可以使用单页应用程序，还可以为站点的所有不同位提供可管理的页面模板？

App.View.Home = Backbone.View.extend({
    tagName: "article",
    id: "view-home",
    initialize: function() {
        _.bindAll(this, "render");
    },
    render: function() {

        var that = this;

        $.get("templates/home.html", function(templateHtml) {
            $(that.el).html(_.template(templateHtml));

            // we want tabs in this template too
            var tabs = new App.View.Tabs();
            $(that.el).find('#main').html(tabs.render().el);

        }, "html");

        return that;
    },
});

如果这没有多大意义，我很抱歉......我一直在努力学习。

Answer 1

我真的没有看到这种方法有什么问题，但很难说没有看到更多的代码。重要的是不要过度思考骨干。主干只有少数事情可以做，除此之外，您可以根据需要利用该功能。

至于这个特殊问题，我认为你不应该做你在这里做的事情。我肯定会确保您在需要之前没有加载/获取任何数据或模板。我还要确保在渲染视图之前等待从服务器获得所需的所有数据（因此视图不会加载）。这些最后几点只是指导原则，与骨干网没有任何关系。但老实说，这是主干的功能之一：它做了一些事情，然后让你不受欢迎。

Answer 2

我认为最简单的方法是拥有许多视图和许多模板，从控制器创建视图，从视图中创建模板。

我们一直在使用jqote2进行模板化，效果很好，我们预先缓存所有模板并让数据驱动应用程序。

每个视图都可以渲染给定div的标记。比如说。

然后控制器可以创建多个视图，例如： -

App.Controllers.X = Backbone.Controller.extend({
   ....
   index: function() {
      new App.Views.View1({
         el: 'div#id1,
         ...
      });
      new App.Views.View2({
         el: 'div#id2,
         ...
      });
etc
   }

希望这有帮助

我想我没有正确使用Backbone JS的观点？

2 个答案: