从一组铁页面链接到具有不同应用程序标题和返回的子页面

Question

这是一个场景： 我有一个实现<iron-pages> 的三页网站。 Nav 是一个带有三个纸张选项卡的工具栏，没有抽屉。当我单击选项卡时，铁页的内容会加载到工具栏下方。都很好。

现在，我想从三个页面之一的内容链接几个子页面。当页面加载时，我不希望它加载到三个选项卡下方，而是一个带有不同工具栏的新页面，左上角有一个箭头返回到上一个视图，单独的标题标题等。

几个问题：

这些子页面是否应该属于三个主页面所在的<iron-pages> 列表？如果没有，你怎么推荐？ （当我这样做时，内容会按预期加载到工具栏下方。）

这些应该是一个完全独立的页面，就像我链接到的 index.html 或 /src 中的同级页面吗？如果是，那么它是同一个应用程序的一部分吗？

对不起，菜鸟问题。在这种情况下，仍在尝试了解单页应用程序的结构。最终，我希望这些页面成为<animated-pages>，这样我就可以从主页过渡到子页面并返回。将这些问题留到下一次...

谢谢！

Answer 1

一个简单的解决方案是将导航栏组件移动到需要它的每个顶级页面。然后，您可以移动新的“子页面”，使其成为其他页面的兄弟。

用户如何导航到您的不同页面不一定需要决定您如何构建 DOM。

回答您的其他问题

这些子页面是否应该属于同一个列表的一部分？ 三个主要页面在？如果没有，你怎么推荐？ （当我做， 内容按预期加载到工具栏下方。）

据我所知，没有。将所有页面（甚至“子页面”）保留为同级将使 DOM 与应用层次结构分离（即，如果视图的层次结构发生变化，您的标记可以保持不变）。

这些应该是一个完全独立的页面，就像一个兄弟 我链接到的 index.html 或 /src 中？如果是这样，它是相同的一部分吗？ 那么应用呢？

Polymer 让我们可以构建可组合的构建块，因此我建议为每个页面使用不同的自定义 Web 组件。在我的应用程序中，我通常将所有 Web 组件放在同一个文件夹中。示例目录结构可能如下所示：

my-app/
  index.html
  src/
    components/
      nav-bar.html
      my-page1.html
      my-page2.html
      my-page3.html

然后您可以在 index.html 中使用您的自定义组件