Question

我正在构建一个简单的应用，其中包含一些标签和页面。我可以让它工作正常，问题是默认情况下没有选中标签。

例如，我有一个像这样的基本结构：

<paper-tabs attr-for-selected="data-route" selected="{{selected}}">
  <paper-tab data-route="1">Tab 1</paper-tab>
  <paper-tab data-route="2">Tab 2</paper-tab>
  <paper-tab data-route="3">Tab 3</paper-tab>
</paper-tabs>

<iron-pages selected="{{selected}}">
  <div data-route="1">Page 1</div>
  <div data-route="2">Page 2</div>
  <div data-route="3">Page 3</div>
</iron-pages>

工作正常。但是，当我打开页面时，默认情况下没有选中任何选项卡。如果我想完成这项工作，我可以指定选择＆＃39;等于特定值，例如：

<paper-tabs attr-for-selected="data-route" selected="1">
  <paper-tab data-route="1">TAB 1</paper-tab>
  <paper-tab data-route="2">TAB 2</paper-tab>
  <paper-tab data-route="3">TAB 3</paper-tab>
</paper-tabs>

问题在于标签/页面绑定无效。

那么，简单的问题是，如何在设置默认选项卡的同时保留绑定？

Answer 1

良好的聚合物编程将这些元素包装在表示应用程序（或应用程序的某个子部分）的自定义元素中。使用默认值在周围元素的selected部分中添加properties属性将设置默认选项卡[警告：仍为聚合物新手]。也许添加如下内容：

Polymer({
    is: 'x-custom',

    properties: {
        selected: {
            value: 1
        }
    }
});

Answer 2

好吧，我认为ready函数是初始化的方法！

ready: function() {
  this.selected = 0;
}

如果需要，请使用属性解决方案＆＃34;选择＆＃34;在组件之外使用

设置默认选项卡/页面选择

2 个答案: