更新聚合物 2 对象数组显示重复值？

Question

我正在尝试更新纸张下拉菜单。第一次更新后，我看到选项数组正确地显示了新项目附加到数组中。

对该数组的任何后续添加都会出现问题，新值会出现在我之前添加的所有项目中。

任何想法为什么会发生这种情况以及如何解决？

试过了：

this.options.push(myNewOption);

this.push('options', myNewOption);

预期：

第一次添加：

this.options
0: {'john', 'smith'}
1: {'one', 'one'}

这很好。

第二次添加：

this.options
0: {'john', 'smith'}
1: {'one', 'one'}
2: {'two', 'two'}

索引 1 现在显示第二个添加的名称！

第三次添加：

this.options
0: {'john', 'smith'}
1: {'one', 'one'}
2: {'two', 'two'}
3: {'three', 'three'}

实际：

例如： 第一次添加：

this.options
0: {'john', 'smith'}
1: {'one', 'one'}

这很好。

第二次添加：

this.options
0: {'john', 'smith'}
1: {'two', 'two'}
2: {'two', 'two'}

索引 1 现在显示第二个添加的名称！

第三次添加：

this.options
0: {'john', 'smith'}
1: {'three', 'three'}
2: {'three', 'three'}
3: {'three', 'three'}

Answer 1

您需要使用this.push 或this.set 来更改聚合物组件的属性，以便聚合物知道何时重新渲染材料。所以使用

this.push('options', myNewOption);

是正确的方法。请参阅Documentation。