绑定iron-page and and

Question

我刚刚开始学习聚合物，目前将纸质标签和铁页捆绑在一起，所以如果我点击标签，内容将被动态加载。在阅读完文档后，这里是我目前所拥有的

<app-toolbar>
<paper-tabs class="tabs" attr-for-selected="page" selected="{{ selectedBrowsePage }}">
    <paper-tab page="artists">
      Artist
    </paper-tab >
    <paper-tab page="artists">
      Album
    </paper-tab>
    <paper-tab page="artists">
      Project
    </paper-tab>
  </paper-tabs>
</app-toolbar>

​

  <iron-pages selectedBrowsePage="artist" selected="{{ selectedBrowsePage }}">
    <div attr-for-selected="page" >1</div>
  </iron-pages>

但是它仍然不能work...could，请给我一个提示，我怎么才能修复它？

Answer 1

您的iron-pages块必须修复-它通过绑定使用selectedBrowsePage，但不会将更改传播到任何地方。selectedBrowsePage="artist"位也是错误的，iron-pages元素上不存在此类属性。对于要通过标记设置的属性，使用camelCase也是无效的，如果需要，可以使用dash-case。

它应该伴随着一些东西：

<iron-pages attr-for-selected="page" selected="{{ selectedBrowsePage }}">
  <div page="artist">1</div>
  <div page="etc...">2</div>
  ...
</iron-pages>

与paper-tabs中的基本相同。这样，一旦iron-pages元素通过selected="{{selectedBrowsePage}}"接收到一些值(比如“艺术家”)，它就会查找任何由attr-for-selected指定的属性被设置为相应值的子元素(这里是第一个div)，并进行神奇的切换。

一旦您掌握了attr-for-selected的工作原理，就可以完全删除它，因为默认行为是使用索引。

纵观PSK，它的模式布局非常整齐。