【问题标题】:aurelia pages with different page formats具有不同页面格式的 aurelia 页面
【发布时间】:2016-10-13 13:01:56
【问题描述】:

在 Aurelia SPA 模板中,它假定每个页面都在 app.html 中,并在顶部使用相同的导航栏。但是我会有很多页面不希望导航栏位于顶部,实际上根本不使用 app.html。我正在查看 main.js ,看起来我可以连接到 bootstrap() 并更改某些页面的 aurelia.setRoot() (我只是在这里猜测),但随后我开始整理 main.js 文件并不久之后它就会变得非常混乱和维护头痛。我真的只想让一些页面完全使用它们自己的格式并忽略 app.html 格式而不做任何疯狂的配置。

我最初的想法是 app.html 应该只是一个空文件,让每个页面决定是否需要导航栏并将其包含在各个页面中。但现在我在许多页面上复制代码,如果标准页面布局发生变化,我必须更改所有单独的页面。不确定解决他的最佳方法。有什么建议吗?

【问题讨论】:

    标签: templates aurelia


    【解决方案1】:

    我实际上不同意吉尔伯特的回答。使用.setRoot 是最佳实践;根只是父视图/视图模型对,您通常会有不同的父视图。这本质上就是您在创建一个空的应用程序视图/viewModel 时所做的,创建一个不做任何事情的新父级。但是添加一个不必要的、未使用的层只是额外的复杂性。

    最好的用例之一是登录页面。登录页面与您的普通应用页面完全不同--有登录提示,没有导航栏等。因此,创建一个“登录”应用程序根和一个“应用程序”应用程序根并在它们之间来回切换。我已经构建了一个名为 Sentry 的模板来演示如何执行此操作。

    Sentry in action

    Sentry on GitHub

    【讨论】:

    • .setRoot 确实很有用。我也在我的应用程序中使用它,我需要限制对我的应用程序特定部分的访问(即登录根目录和主应用程序根目录)。关于您的陈述:“但是添加不必要的,未使用的层只是额外的复杂性”,使用 .setRoot 将指向带有路由器的文件。我的例子也是如此。我更喜欢我的方法,因为我可以将路由映射到 标记,而不是从 viewModel 调用 .setRoot。
    【解决方案2】:

    如您所说,使用 set root 是个坏主意。与您所说的类似,您可以让 app.html 仅包含路由器视图标记。您希望共享相似页面布局的应用程序的不同部分将在不同的路线下进行分组。现在这些路由中的每一个都将指向另一个在视图中具有不同样式的路由

    只需将其视为一个空的 app.html,其中包含具有样式的子 app.html(例如,不同的导航栏、页面布局等)

    【讨论】:

      猜你喜欢
      • 2016-08-13
      • 1970-01-01
      • 2018-10-10
      • 2014-10-31
      • 1970-01-01
      • 1970-01-01
      • 2023-03-16
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多