当滚动条在阴影之外时，分部分加载聚合物铁列表-dom

Question

我的 Polymer 应用程序使用 app-layout-structure。根元素可以简化如下：

<app-drawer-layout fullbleed>
  <app-drawer swipe-open>
    <iron-selector selected="{{page}}" attr-for-selected="name" role="navigation">
      <!-- list of Side Menu options -->
    </iron-selector>
  </app-drawer>
  <app-header-layout has-scrolling-region>
    <app-header fixed effects="waterfall">
      <!-- Top Menu -->
    </app-header>
    <iron-pages role="main" selected="[[page]]" attr-for-selected="name">
      <!-- Here is custom elements that can be selected via Menu -->
    </iron-pages>
  </app-header-layout>
</app-drawer-layout>

单击菜单选项时，将显示该页面。一页在中列出了很多我想要的项目。

我在滚动时调整大小时遇到问题，因为滚动条位于其父项的父项中。

ready: function(){
  //this is the app-header-layout element from the root
  this.$.ironList.scrollTarget = this.parentNode.parentNode;
},

我一直坚持让列表显示滚动偏移量的点击次数，并且再也没有加载更多。属性 firstVisibleIndex (0) 和 lastVisibleIndex（8，显示的项目数，小于滚动偏移量）保持不变。当我设置 iron-list.scrollTarget（iron-pages、app-header-layout 不起作用）并 fire iron-resize 显示所有其他项目时，lastVisibleIndex 是最后一个索引。

Answer 1

我认为你需要得到一个正确的 scrollTarget 因为你的方法不正确。您需要找到 app-header 元素并获得它自己的 scrollTarget:

ready: function(){
   //get parent node and query app-header
   this.$.ironList.scrollTarget = this.domHost.$$('app-header').scrollTarget;
}

当滚动条在阴影之外时，分部分加载聚合物铁列表-dom

Loading polymers iron-list in parts, when scrollbar is outside shadow-dom

javascript

shadow-dom

polymer

iron-list