Angular(2+)：改变子组件中的输入参数

Question

改变子组件中的输入参数是否正常，还是应该将所有输入对象视为只读，然后将任何更改的事件发送回父组件并将更改委托给父组件？修改输入参数是否可能出现任何问题。

class ChildComponent {

  @Input() parentParam;
  @Output() clickValEvent = new EventEmitter<boolean>();

  let parentParamClone = Object.assign({}, parentParam);

  childClickEvent(val) {
    //Update value locally.
    // parentParam.clickVal = val;

    //Inform parent & let it do necessary change.
    // this.clickValEvent.emit(val);

    //Only play with local clone.
    // parentParamClone.clickVal = val;
    }
}

Answer 1

没错，是的，您可以修改@input子组件中的值，它将反映在您的父组件中。但你应该避免这种情况的原因有两个：

1. 它不适用于原始值，如果您希望更改@input原始值并且它反映在您的父组件中，则这将不起作用。

2. 这不是一个好的做法，它为所有子组件提供了任意更新对象的机会@input，并使我们难以跟踪值的变化。所以使用它@output可以节省我们将来维护代码的大量精力，因为它更具声明性。

我觉得很奇怪，我无法从 Angular 文档中找到任何与此相关的官方解释。ReactJs与和不同VueJs，它们非常不鼓励我们改变props子组件。