Question

基于此fact，不推荐使用应用程序中的Region。你如何渲染根布局？简单地说，RootLayout（）不会渲染布局视图。我知道调用区域show（）函数将呈现布局，但由于Application对象上没有区域。你如何渲染根布局？

该文件提出了以下方式，但它并不起作用。

我定义了这样的根布局：

var RootView = Marionette.LayoutView.extend({
  el: 'body'
});

然后渲染根布局：

var canvasApp = new Marionette.Application();
canvasApp.on('start', function() {
    canvasApp.rootView = new RootLayout();
}
$(document).ready(function(){
    canvasApp.start();

});

Answer 1

可能就像

一样简单

var RootView = Marionette.LayoutView.extend();
var rootView = new RootView();
rootView.render().$el.appendTo( document.body ); // or a selector

或

var RootView = Marionette.LayoutView.extend();
var rootView = new RootView({ el: '#app' });
rootView.render();

或者，如你的情况

var RootView = Marionette.LayoutView.extend({
  el: 'body'
});
var rootView = new RootView();
rootView.render(); // just remember to render it

Answer 2

定义LayoutView中的区域，然后显示所需的视图

var RootView = Marionette.LayoutView.extend({
  el: 'body,
  regions: {
    menu: "#menu",
    content: "#content"
   }
});

RootView.getRegion('menu').show(new MenuView());
RootView.getRegion('content').show(new ContentView());

您可以在http://marionettejs.com/docs/marionette.layoutview.html#basic-usage

找到更多信息

Answer 3

这可能是一个老问题，但我能够解决这个问题：

var App = new Marionette.Application();

App.addRegions({
  mainRegion: '#app'
});

App.mainRegion.show(new RootView());

App.start();

如何在Marionettejs中渲染根布局？

3 个答案: