2017-04-27 186 views
0

我正在嘗試使用應用程序工具欄和紙張選項卡來構建帶Polymer 2.0 RC的基本工具欄。我根據文檔創建了標題,併爲底部的應用程序工具欄添加了紙張標籤,但它們不可見。聚合物2;紙張不可見

  • 我正確導入的所有元素
  • 我試圖第二應用,工具欄的高度設置爲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> 

回答

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" 
}, 
+0

謝謝!!這解決了問題! –