Question

我正在构建一个SPA聚合物1.0应用程序，如下所示：

<iron-pages attr-for-selected="data-page"
            selected="{{page}}">
  <div data-page="home">
    <paper-header-panel mode="{{mainMode}}">
      <profile-toolbar></profile-toolbar>
      <div class="content">
        <search-menu></search-menu>
      </div>
    </paper-header-panel>
  </div>
  <div data-page="search">
    <paper-drawer-panel ...>
      ...
    </paper-drawer-panel>
  </div>
</iron-pages>

<profile-toolbar>是包含<paper-toolbar>的自定义元素。如果我遗漏<paper-header-panel>它有效，但有一个填充，滚动不能正常工作。所以我添加了<paper-header-panel>。

第二页还在抽屉内部包含<paper-header-panel>并且工作正常，但如果第一页包含<paper-header-panel>，则无法显示任何内容。我错过了什么？

Answer 1

尝试将以下css类添加到作为paper-header-panels直接父级的div：

.content {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

Answer 2

Here is a solution你可以试试。

Note this open bug已经（显然）已经解决了除iOS（Safari）以外的所有问题。

铁页内的纸页面板显示没有内容

2 个答案: