React 组件的重要概念：一个组件应该只管理自己的状态，而不应该管理自己的 props。
实际上，一个组件的 props 具体就是“另一个组件（父组件）的状态”。所以道具必须由其组件所有者管理。这就是为什么所有 React 组件对于它们的 props 都必须像纯函数一样工作（而不是直接改变它们的 props）。
我将向您展示一个简单的示例：
class ParentComponent extends Component {
constructor(props) {
super(props);
this.state = {
p1: {a:1, b:2},
}
render() {
return
}
}
在 ChildComponent 中，如果你想改变“传递的 prop p1”（p1 是一个有自己的 ref 的对象）（例如在 ChildComponent 中，你写：），p1.a=3那么显然，“p1 - ParentComponent 状态的属性"也发生了变异。但是在这种情况下，ParentComponent 无法重新渲染，因为您没有触发setState()ParentComponent 中的操作。所以它会为一个不稳定的 React App 产生许多不受控制的错误。
我希望现在你能理解为什么 React 会这样说：
严格的规则：所有 React 组件在其 props 方面必须像纯函数一样工作（不要直接改变它们的 props）。
奖励：为了正确更改（变异）道具，您必须在 ChildComponent 中使用“回调 fnc 道具”。现在，它很好地尊重了 React 组件的概念。
class ParentComponent extends Component {
constructor(props) {
super(props);
this.state = {
p1: {a:1, b:2},
}
this.changeP1 = () => {
this.setState({p1: {a:3, b:4}});
}
render() {
return
}
}