Question

我目前正在使用Marionette 2.4.7并使用LayoutViews构建我的应用程序。举一个非常简单的例子LayoutViews（通常模板是独立的）：

var LayoutView = Marionette.LayoutView.extend({
    template: "<div id="main-region"></div><div id="menu-region"></div>",
    regions: {
        mainRegion: "#main-region",
        menuRegion: "#menu-region"
    }
});

var MainLayoutView = Marionette.LayoutView.extend({
    template: "<div id="title-region"></div><div id="content-region"></div>",
    regions: {
        titleRegion: "#title-region",
        contentRegion: "#content-region"
    }
});

基本上，页面分为两部分，一部分用于显示页面标题，另一部分用于显示主要内容。我使用以下内容填充内容区域：

    var layoutView = new LayoutView();

    var mainLayoutView = new MainLayoutView({ className: "someClass" });
    layoutView.mainRegion.show(mainLayoutView);
    var contentLayoutView = new ContentLayoutView();
    mainLayoutView.contentRegion.show(contentLayoutView);

ContentLayoutView有子区域并且做了很多其他的事情，所以这是一个非常复杂的观点。 titleRegion的{{1}}只显示几个字，非常简单。

现在我的问题是，有没有办法解决为MainLayoutView创建ItemView的问题，只是为了显示几个字？在我的整个应用程序中，这种情况会重复几次，并且似乎需要为每种情况创建单独的titleRegion。我知道我可以使用

设置ItemViews

DIV HTML

但我想坚持$("#title-region").html("Page title");做事的方式。

我试过了：

Marionette

但我收到错误：mainLayoutView.titleRegion.show("Page name");，显然是因为'view.on' is not a function期待.show。

Answer 1

我可能会将标题作为mainLayoutView模板的一部分。我不确定你使用的是什么模板语言，但它看起来像是：

"<div id="title-region">{title}</div><div id="content-region"></div>"

然后，您可以在templateHelpers定义中定义MainLayoutView函数，例如：

templateHelpers: function() {
  return { title: this.options.title };
}

当你创建MainLayoutView时，你会传递你需要的任何标题：

var layoutView = new LayoutView();
var mainLayoutView = new MainLayoutView({
                                           className: "someClass",
                                           title: "Welcome!"
                                        });
layoutView.mainRegion.show(mainLayoutView);
var contentLayoutView = new ContentLayoutView();
mainLayoutView.contentRegion.show(contentLayoutView);

title实际上可能已经是视图中的属性（我无法记住），因此您可能需要在我使用的地方使用layoutTitle或类似内容{{ 1}}

Marionette LayoutView区域 - 显示非ItemView内容

1 个答案: