我正在尝试在我的应用程序上制作纸质标签。选项卡1和页面1必须在页面加载时选择,不幸的是当我试图使用激活tab1激活属性selected=0
页面加载时,但我无法更改为任何其他选项卡,我总是看到只有Tab 1
与Page 1
有人请告诉我该怎么做才能解决这个问题?
最好的祝福
我正在写下我尝试过的内容。
我的导入扩展
<link rel="import" href="../bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="../bower_components/core-pages/core-pages.html">
<link rel="import" href="../bower_components/core-ajax/core-ajax.html">
和代码:
<paper-tabs selected="0">
<paper-tab>Tab 1</paper-tab>
<paper-tab>Tab 2</paper-tab>
<paper-tab>Tab 3</paper-tab>
</paper-tabs>
<core-pages selected="0">
<div>Page 1</div>
<div>Page 2</div>
<div>Page 3</div>
</core-pages>
第二选择
<paper-tabs selected="{{0}}">
<paper-tab>Tab 1</paper-tab>
<paper-tab>Tab 2</paper-tab>
<paper-tab>Tab 3</paper-tab>
</paper-tabs>
<core-pages selected="{{0}}">
<div>Page 1</div>
<div>Page 2</div>
<div>Page 3</div>
</core-pages>
这是解决问题的方法:
Polymer('progress-page', {
ready: function () {
// make global values available on instance.
this.selected = 0;
}
});
尝试使用selected="{{activeTabId}}"
并在JavaScript中设置默认值:activeTabId: 0
您可以创建一个自定义元素,使用页面包装选项卡,然后使用双向绑定{{selected}}
自动保持选项卡和页面同步。
这是easy-paper-tabs的要点