Polymer.prototype.splice的行为不符合预期 [英] Polymer.prototype.splice don't behave as expected
问题描述
我正在使用Polymer的阵列突变方法进行阵列突变.
I'm doing array mutation with Polymer's array mutation methods.
this.allRules = [{name: "abc", enabled: true}];
var item = this.allRules[index];
item.name = "abcdxfdsa";
item.enabled = enabled;
// console log out [Object]
console.log(this.allRules);
this.splice('allRules', index, 1);
// Instead of logging out [], it logs out [splices: Object]
console.log(this.allRules);
this.push('allRules', item);
// It logs out [Object, splices: Object]
console.log(poly.allRules);
这很烦人.当我将this.allRules
绑定到dom-repeat
模板(例如下面的模板)中时,更新的绑定数据时,它将显示被拼接的项目,而不是新添加的项目.因此,在进行拼接和推送之后,我得到的不是"abcdxfdsa"
,而是拼接前的值,而不是获得"abcdxfdsa"
作为项目名称.这是指向示例dom-repeat
数据绑定的链接. 聚合物dom-repeat如何通知阵列已更新
And the annoying thing is this. When I bind this.allRules
into a dom-repeat
template, such as the one below, when updated binded data, it shows the item that was spliced instead of the newly added item. So after a splice and a push, instead of getting "abcdxfdsa"
as item name, I get abc
, which is the value before splicing. Here is the link to a sample dom-repeat
data binding. Polymer dom-repeat how to notify array updated
推荐答案
实际上应该从数组中删除该项目.它第二次以[splices: Object]
身份登出,只是为了显示有关此数组的更多信息,因为它具有一个名为
Actually the item should be removed from the array. The second time it logs out as [splices: Object]
just to show more info about this array, as it has a property called splices. If you run the same thing in Firefox you will still see [object]
so I guess this is just a Chrome console helper thing.
要获取要更新的值,一种方法是将this.push
调用包装在this.async
方法内.
To get the value to be updated, one way is to wrap the this.push
call inside a this.async
method.
this.async(function() {
this.push('allRules', item);
console.log(item);
console.log(this.allRules[0].name);
// returns 1, meaning it's filled with one item again
console.log(this.allRules.length);
});
看看这个 plunker 作为工作示例.
Have a look at this plunker for a working sample.
这篇关于Polymer.prototype.splice的行为不符合预期的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!