Polymer 1.0 如何延迟渲染 dom-repeat答案

【问题标题】：Polymer 1.0 How to lazy render dom-repeatPolymer 1.0 如何延迟渲染 dom-repeat
【发布时间】：2016-10-03 21:40:17
【问题描述】：

我有一个非常大的 dom-repeat，需要 10 秒才能在屏幕上完全呈现。有没有办法逐步渲染dom-repeat的一部分，直到完全渲染？

<template is="dom-repeat" items="{{itemList}}">
  <span>{{item}}</span>
</template>

该列表大约有 16000 个条目，之所以这么长，是因为在我的应用程序中它是一个三重嵌套的 dom-repeat。我用它来渲染paper-menu 和paper-submenu

【问题讨论】：

您应该使用iron-list 来仅渲染视口可见的项目子集。
@tony19 谢谢！虽然我应该指定我使用paper-menu 和paper-submenu 渲染它。每个菜单项都有子菜单，共3层。这就是为什么需要这么长时间。你会认为paper-submenu 应该只延迟加载视口可见的项目，但显然它们不会:(
菜单中的 16000 项似乎非常高，可能是用户体验问题。在任何情况下，您都可以动态加载菜单项（在展开菜单项时或滚动时）。
完全同意！如果没有现有的实用函数来延迟加载paper-submenu，那么我将实现一个动态加载函数。
你试过this吗？

【解决方案1】：

聚合物分页组件可以帮助您。在
customelements.io 或中查看聚合物分页组件 mercury-paginator

【讨论】：