Input(() 字段中的更改是否会传播到父组件？

Question

我的理解是，我可以使用指令 @Input() 将数据传递给子组件，并使用 @Output() 和适当的发射将数据发送回父组件。但我不知道 @Input() 字段中的更改数据会发送到父级。它是否正确？

我修改了组件通信工作簿以重现此https://input-params.stackblitz.io

你可以解释吗？

谢谢，

Answer 1

是的，您可以使用 @Input() 将数据传递给子组件。这是引用绑定的，因此当您更改子组件中的值时，也会反映在父组件中。

使用 @Output() 您可以将任何数据从子组件发送到父组件。但由于传递的数据是引用绑定的，因此即使您不使用 @Output() 将其传回，该值也会在父级中发生更改。

但是，如果您只想更改子组件中的值，而不是在父组件中获取更改后的值，您可以制作数组的另一个副本，并使用 @Input() 将其传递给子组件。

您可以使用以下方法复制原始数组：

let inputArray = _.cloneDeep(this.originalArray)

_ 是 lodash 库，提供了许多此类选项。

要使用 lodash，您必须在导入中添加以下行：

import * as _ from 'lodash';