在 Polymer 1.0 中,当我尝试为选项卡添加可滚动选项时,宽度似乎变为 0。
<paper-toolbar id="mainToolbar">
<paper-icon-button id="paperToggle" icon="menu" paper-drawer-toggle></paper-icon-button>
<span class="flex"></span>
<!-- Toolbar icons -->
<paper-icon-button icon="refresh"></paper-icon-button>
<paper-icon-button icon="search"></paper-icon-button>
<!-- Application name -->
<div class="middle paper-font-display2 app-name">Polymer Starter Kit</div>
<!-- Tabs -->
<paper-tabs id="scrollableTabs" tabindex="0" selected="0" scrollable class="bottom x-scope self-end paper-tabs-0">
<paper-tab>Bordeaux</paper-tab>
<paper-tab>Burgundy</paper-tab>
<paper-tab>Champagne</paper-tab>
<paper-tab>Rhone</paper-tab>
<paper-tab>France</paper-tab>
<paper-tab>Italy</paper-tab>
<paper-tab>Spain</paper-tab>
<paper-tab>Americas</paper-tab>
<paper-tab>Australia & NZ</paper-tab>
<paper-tab>Rest of World</paper-tab>
<paper-tab>Spirits & Fortifieds</paper-tab>
</paper-tabs>
</paper-toolbar>
如果我删除可滚动,它们会正常显示。
文档说
If true, tabs are scrollable and the tab width is based on the label width.
太好了……但是在哪里设置标签宽度? 最佳答案
在评论中暗示@Tasos 之后,我设法在纸标签上简单地使用 flex
使其工作,并进行了一些测试。
在 Scrollable 演示中,它在没有宽度的情况下工作正常,只是因为它在工具栏中没有 bottom
类,这就是宽度困惑的原因。
关于 polymer 纸标签可滚动问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31345759/