聚合物2;纸张标签不可见

时间:2017-04-27 09:53:31

标签: polymer-2.x

我正在尝试使用app-toolbars和paper-tabs使用Polymer 2.0 RC构建基本工具栏。我根据文档创建了标题,并添加了底部应用工具栏的纸质标签,但它们不可见。

  • 我正确导入了所有元素
  • 我尝试将第二个应用工具栏的高度设置为100%
  • 我试图在主文档中使用纸质标签,但它们都没有显示
  • 它不能用于chrome或FF

任何帮助表示赞赏!谢谢!

我的代码:

<app-drawer-layout fullbleed>
  <!-- app-headers -->
  <app-header-layout has-scrolling-region>
    <app-header slot="header" fixed shadow condenses effects="waterfall">
      <app-toolbar id="topbar">
        <paper-icon-button icon="app-icons:menu" drawer-toggle></paper-icon-button>
        <div main-title>WASC Hosting</div>
        <paper-icon-button icon="app-icons:code"></paper-icon-button>
        <paper-icon-button icon="app-icons:search"></paper-icon-button>
        <paper-progress value="10" indeterminate bottom-item></paper-progress>
      </app-toolbar>
      <app-toolbar>
        <paper-tabs selected="0">
          <paper-tab>Food</paper-tab>
          <paper-tab>Food</paper-tab>
          <paper-tab>Food</paper-tab>
        </paper-tabs>
      </app-toolbar>
    </app-header>

    <!-- view contents -->
    <iron-pages selected="[[page]]" attr-for-selected="name" fallback-selection="view-404" role="main">
      <wasc-view-main name="main" class="content"></wasc-view-main>
      <wasc-view-console name="console" class="content"></wasc-view-console>
      <wasc-view-products name="products" class="content"></wasc-view-products>
    </iron-pages>

  </app-header-layout>
</app-drawer-layout>

1 个答案:

答案 0 :(得分:2)

请看Polymer 2.0 installation Documentation

您是否正确安装了带有凉亭的纸张标签?

bower install --save PolymerElements/paper-tabs#2.0-preview

看看我的bower.json:

"dependencies": {
    "app-layout": "PolymerElements/app-layout#2.0-preview",
    "app-route": "PolymerElements/app-route#2.0-preview",
    "iron-flex-layout": "PolymerElements/iron-flex-layout#2.0-preview",
    "iron-icon": "PolymerElements/iron-icon#2.0-preview",
    "iron-media-query": "PolymerElements/iron-media-query#2.0-preview",
    "iron-pages": "PolymerElements/iron-pages#2.0-preview",
    "iron-selector": "PolymerElements/iron-selector#2.0-preview",
    "paper-icon-button": "PolymerElements/paper-icon-button#2.0-preview",
    "paper-tabs": "PolymerElements/paper-tabs#2.0-preview"
    "polymer": "Polymer/polymer#^2.0.0-rc.1",
    "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0-rc.4"
},
"resolutions": {
    "polymer": "^2.0.0-rc.1"
},