2

我有一个关于在我正在处理的 Marionette 应用程序中使用区域中的视图呈现布局的工作解决方案，但感觉有些不对劲。您必须将任何内容直接附加到 DOM 吗？

这是我在控制器中的方法：

 //Grab the main Layout
        var layout = new APP.Views.LayoutView();

        //Render that layout
        layout.render();

         //Make the model
        var simpleModel = new APP.Models.simpleModel({
          "field1" : "foo",
          "field2" : "bar"
        });


        layout.header.show(new APP.Views.subView({model: simpleModel}));

        $('body').html(layout.el);

这是我感觉不自然的最后一部分。这主要是因为如果我将 'layout.header.show' 移到 .html() 之后，则它无法正确呈现。如果区域在将其推送到 DOM 后不能动态更改，那么区域的意义何在？

这是我的布局：

APP.Views.LayoutView = Backbone.Marionette.Layout.extend({

  template: "#layoutTemplate",

  className : 'wrapper',

  regions: {
    header: "#header",
    footer: "#footer"
  }


});

这是子视图：

APP.Views.subView = Backbone.Marionette.ItemView.extend({

    template : '#headerTemplate',

    className: 'container'


});

正如我所说，这可行，但感觉就像我没有正确使用区域。是否有更好、更简洁的方法来执行此操作，允许您在将布局渲染到 DOM 后访问区域？

在Marionette 文档中似乎没有提到使用 .html() 来获取页面上的内容——我想知道这是否因为不需要或被假定而被遗漏了。

任何人都可以帮忙吗？

4

1 回答 1

4

好的，似乎可以通过在应用程序中创建一个“区域”来规避这种情况，然后使用 .show() 来显示其中的布局。

这是我在 SO 上找到的小提琴的链接：http: //jsfiddle.net/TDqkj/6/

以及另一个问题：Understanding layouts in Marionette for Backbone.js

小提琴特别有这个代码：

App = new Backbone.Marionette.Application();
App.addRegions({
   'nav': '#nav',
  'content': '#content'
});

程序员使用它来向这些区域添加布局——这意味着您永远不必附加到 DOM。

如果其他人有更优雅的解决方案，请发布！

于 2013-03-27T12:37:28.877 回答