dom更改元素顺序后，聚合物2铁选择器选择的元素不会更新

Question

我有一个组件，其中有4个实例。

用户点击数字2，产品B被选中。

当重新订购dom时，稍后他选择另一个选项后，这4个组件卡砖实例被重新订购（因为价格变化，所以这会在流程中自动发生）都很好...除了因为所选元素（编号2）移到了位置1。

然后...继续选择第二个元素而不是产品B！

用户界面显示选定的产品D。

似乎聚合物2在重绘DOM时以某种方式忽略了此选定的属性。如何避免这种情况？

<iron-selector id="something-semantic" attr-for-selected="value" selected={{value}}>
    <template is="dom-repeat" items="[[filteredProductosCategorias]]" as="productoCategoria" id="productoTipo">
        <div class="card-brick" value="[[productCategoria.id]]" tabindex="1" on-keyup="_seleccionaCategoria">
        </div>
    </template>
</iron-selector>

所选内容将按照DOM顺序坚持到先前选择的元素。我如何才能使此选定的值也更新域名更改？

有什么建议可以解决这个问题？？用户可能会感到困惑。

Answer 1

问题在于dom-repeat不会重建内部元素，因为这将是繁重的操作。它只是为子元素分配新值，这意味着铁选择器不知道内容已更改。在示例中，您选择了第二个元素，并且在重新排序之后，它仍然是选择的第二个元素。

我对_selectCategory的操作感到困惑，因为如果它设置了类别，那么您甚至可能甚至不需要iron-selector。我从来没有亲自使用过该元素（也永远不会使用它，因为自己编写它很简单）。无论如何，如果您使用_selectCategory重新排序，则只需将新的value属性设置为this.set()。