Question

我有一个铁列表元素，其中包含大约500个项目，并实现了过滤功能（如How to filter an iron-list in polymer 1.0?中的那个）。显示和过滤项目效果很好，除非我的过滤器限制太多：在这种情况下，显示的某些项目与当前过滤器不匹配，但之前的过滤器不匹配。根据我的理解 - 当铁列表中的项目数量减少时 - 已创建的显示（虚拟）项目不会被删除。

示例：项目{A，B，C，D，E，F，G，H，I}匹配过滤器X. iron-list元素有5个虚拟元素（简化标记）：

<iron-list>
    <div>A</div>
    <div>B</div>
    <div>C</div>
    <div>D</div>
    <div>E</div>
</iron-list>

然后我将过滤器更改为Y，只有H和I作为匹配项：更新后的标记如下所示：

<iron-list>
    <div>H</div>
    <div>I</div>
    <div>C</div>
    <div>D</div>
    <div>E</div>
</iron-list>

我预计铁列表中只有两个div元素，但似乎保持了一定数量的虚拟化项目。我试图通过调用notifyResize（）和其他方法来更新元素（参见https://www.webcomponents.org/element/PolymerElements/iron-list/elements/iron-list），但没有效果。

除手动删除备用虚拟元素外，还有什么想法？

Answer 1

显然，铁列表增加了一个隐藏的＆＃34;属性为不应该可见的虚拟元素 - 我之前没有注意到。

添加CSS指令，如

#list .item[hidden] { display: none; }

解决了上述问题。

Answer 2

除了手动删除数组或使用notifyResize之外，我认为还有其他选择。显然我会选择第二个。

如果没有看到您的代码，我不知道它为什么会对您起作用，但here使用notifyResize是类似的情况。

聚合物铁列表显示过时的项目

2 个答案: