MarionetteJS:应用程序区域与布局

时间:2015-01-06 21:41:37

标签: backbone.js marionette backbone-views

我正在阅读最新版本(2.3.0)的文档,它说现在已弃用应用程序区域。

  

申请区域

     

警告:不建议使用此功能已弃用。而不是使用   应用程序作为视图树的根,您应该使用布局   视图。要将布局视图范围限定为整个文档,您可以进行设置   它的主体是'。这可能类似于以下内容:var   RootView = Marionette.LayoutView.extend({el:' body'});

在大多数教程中,包括David Sulc的书Backbone Marionette:A Gentle Introduction,它使用以下代码片段向应用程序添加区域。

而不是下面使用addRegions的示例,我应该做什么呢?

var ContactManager = new Marionette.Application({});
ContactManager.addRegions({
    mainRegion: "#main-region"
});

var ContactView = Marionette.ItemView.extend({
    template: "#whatever",
    ui: {
        button: ".button".
    },
    events: {
        "click @ui.button": "click",
    },
    click: function () {
        console.log("do stuff here...");
    }
});

ContactManager.on("start", function () {
    var contactView = new ContactView({
        model: someModel
    });
    ContactManager.mainRegion.show(contactView);
});

1 个答案:

答案 0 :(得分:7)

使用layoutview代替。

你可以这样做:

var ContactManager = new Marionette.Application({});
var LayoutView = Backbone.Marionette.LayoutView.extend({
  template: "#layout-view-template",

  regions: {
    menu: "#menu",
    content: "#content"
  }
});

ContactManager.layout_view = new LayoutView(); 
ContactManager.layout_view.render(); 

我从未直接向我的app对象添加区域。