动态 search/filter 核心列表（聚合物 0.5）

Question

我需要实施过滤器类型的搜索，如果项目与搜索不匹配，它会隐藏核心列表中的项目。我创建了一个 .hidden class 如果表达式 returns false:

应用于项目

class = {{ {hidden: !match(model.host, hQuery)} | tokenList }}

元素已隐藏，但列表不会重排元素，除非我单击可见行。有没有办法使用函数调用强制回流？

Answer 1

这就是我在代码中所做的，并且有效：

 <div style="{{hide_part1}}">
 ...content to show/hide...
 </div>
 ....

根据路线变化切换它（flatron-director）：

  routeChanged: function(oldValue, newValue) {

        if ('some_route_1' == this.route) {

            this.hide_part1        = ''
            this.hide_part2    = 'display: none;'

        } else if ('some_route_2' == this.route) {

            this.hide_part1        = 'display: none;'
            this.hide_part2    = ''
       }
   },

还使用核心列表的 updateSize()，尤其是 scrollToItem(0)，即回到顶部，这里那里帮助我也有问题 'reflow'：

Answer 2

经过一周的努力，隐藏列表项并不是处理此问题的正确方法。遍历原始数组，将任何匹配的对象推送到临时数组，然后将 core-list 的 .data 数组替换为临时数组：this.$.list_id.data = tmpArray。对于最多 10K 条记录的列表，性能良好。

动态 search/filter 核心列表（聚合物 0.5）

Dynamic search/filter core-list (Polymer 0.5)

polymer