javascript - 在Angular 2+中处理子组件中通过引用传递的对象

Question

我知道 TypeScript 通过引用传递对象，并且没有明确的最佳实践来绕过它来获得深层副本，但我发现很难使用它，尤其是在使用主题时。

我刚刚遇到了一个组件，它有一个对象数组并将它们传递给子组件。每个子组件都会更新作为输入传递的单个对象。问题：我不是编写它的人，所以我不知道子组件直接修改了值。即使我是，我很确定六个月后我也不会记得了。

是否有明确的最佳实践来处理这个问题？

标签： javascriptangulartypescript

Answer 1

如果 lodash 在您的工具带中，您可以使用 _.cloneDeep()。我已经将它可靠地用于相对较大的对象和大型集合，没有任何问题。

https://lodash.com/docs/4.17.15#cloneDeep

var objects = [componentObj1, componentObj2];
var deep = _.cloneDeep(objects);
console.log(deep[0] === objects[0]);
// => false