MarionetteJS：应用程序区域与布局 [重复]

Question

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

应用区域

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

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

下面的示例使用 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);
});

Answer 1

改用布局视图。

你可以这样做：

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(); 

我从来没有直接将区域添加到我的应用程序对象中。