Polymer 1.0+ iron-list 加载隐藏列表项？

Question

polymer 的 iron-list 元素加载一堆 unused/hidden 列表项是否正常，即使它实际上只传递了少得多的数组项到它的 items 属性？

我有一个 iron-list，目前传递的是一个 4 项长的数组，但如果需要，可以为更长的列表提供屏幕空间。然而，当我检查 Chrome 中呈现的 iron-list 元素时，在其 'items' div 中有 4 个可见项和 16 个隐藏项。我在想这可能与准备列表的 scrolling/paging 有关？如果是这样，有没有办法阻止 iron-list 完成准备较小阵列不需要的项目模板的所有工作？

我注意到在我的应用程序的其他地方也发生了类似的情况，其中为 iron-list 提供了一个长度为 1 的数组。在这种情况下这确实有问题，因为此列表的项目模板包含更复杂的自定义元素，然后 'readied' 20 次而不是一次。这确实对应用程序的负载产生了巨大影响 time/performance。

希望这里有一个简单的解决方案，并且我不必重新考虑在此应用程序中使用 iron-list。也许我做错了什么。谢谢！

似乎有人也在 GitHub 上提出了这个问题：https://github.com/PolymerElements/iron-list/issues/55

Answer 1

是的，这是正确的行为。而不是创建或删除 DOM 个元素 iron-list 回收单元格以在移动设备上平滑滚动。所以默认情况下它总是会生成 20 个项目，无论数据量是数十还是数千个项目。此 polycast 解释了有关黄油平滑滚动的更多信息。

有几件事要尝试：

我会让你的铁名单 <template> 内容深 1 级。（不要在这里嵌套标签，只使用绝对最小数量的元素。你也可以尝试绝对 CSS 定位）
如果您的模板行非常大，您可以尝试使用 iron-list private _physicalCount 属性.

铁名单示例：

var list = this.querySelector("iron-list");
list._physicalCount = 4; // default is 20

Answer 2

对于已知的固定长度项目数组，尤其是较短长度的项目数组，实际上最好使用 dom-repeat 模板。因此，iron-list 在我上面的例子中被误用了（至少是为了它的预期目的）。参考相关 GitHub 问题和建议：

https://github.com/PolymerElements/iron-list/issues/68

Polymer 1.0+ iron-list 加载隐藏列表项？

Polymer 1.0+ iron-list loading hidden list items?

polymer

polymer-1.0

paper-elements