说明:儿童组件的方法已经从父组件调用一个array of objects
作为参数。在子组件,该分配到array
一个变量。
父组件:
let obj = [{
'prop1': 'value1',
'prop2': 'value2'
},{
'prop1': 'value1',
'prop2': 'value2'
}];
this.child.sendObject(obj);
子组件:
public sendObject(obj) : void {
this.updatedObj = obj;
}
问题陈述 :
let obj = [{
'prop1': 'value4',
'prop2': 'value2'
},{
'prop1': 'value1',
'prop2': 'value7'
}];
this.child.sendObject(obj);
obj
阵列中添加。
子组件:
public sendObject(obj) : void {
this.updatedObj = obj;
}
public addNewObj() {
this.updatedObj.push({
'prop3': 'value3',
'prop4': 'value4
})
}
我想验证(检查平等)此前发送的对象与此更新的对象。
我试过这么远?
子组件:
public sendObject(obj) : void {
const copy = JSON.parse(JSON.stringify(obj));
this.updatedObj = obj;
if (JSON.stringify(this.updatedObj) === JSON.stringify(copy)) {
console.log("Not changed");
} else {
console.log("Changed");
}
}
上述逻辑工作正常,如果从父修改的对象的属性,但如果我在子组件添加任何新对象插入到现有的阵列(this.updatedObj
),并从父切换回孩子。它打破,仅显示从父传递的对象。
仅一个分量应该是所述阵列的“所有者”。在你的情况下,它看起来像父母应该为此事负责。子组件然后应不是数据推到直接在阵列而是应该发射事件至其与它要加入和父应的那些数据推入数组中的数据输出。
因为有内部的对象的关键顺序没有担保透过JSON.stringify您的解决方案是脆弱的。这些对象是相同的,但比较会失败:
让OBJ1 = { 'PROP1': 'VALUE1', 'PROP2': '值2'};
让OBJ2 = { 'PROP2': 'VALUE2', '为prop1': 'VALUE1'};
你可以递归排序stringfying之前每个对象键,但是这将是缓慢的,由于排序和stringfying。
您可以从像Lodash(https://lodash.com/docs#isEqual)或下划线(https://underscorejs.org/#isEqual)图书馆使用“深平等”的功能。
如果你想建立自己的比较函数来看看这个问题的答案:qazxsw POI