如果值被父级更改，是否会触发 onChange？

【问题标题】：is onChange triggered if the value is changed by parent?如果值被父级更改，是否会触发 onChange？
【发布时间】：2022-01-07 16:30:55
【问题描述】：

const [value, set_value] = useState({a: 1});

<Child
  value={value}
  onChange={callback}
</Child>

set_value({a: 2})

当set_value({a: 2}) 运行时，会触发onChange 内部的callback 运行吗？

【问题讨论】：

没有。它将触发重新渲染。
你能澄清一下吗？你的说法令人困惑。
为什么会呢？当然不是直接的，但是Child 对onChange 做了什么？ callback 来自哪里？为什么不把console.log("I got called")加进去，运行代码就知道了？
jonrsharpe 是对的，事实上，我们不能绝对肯定，因为您没有提供minimal reproducible example。

标签： javascript html reactjs material-ui

【解决方案1】：

我认为这个问题最准确的答案是：
“这取决于<Child> 组件。”

从 Reacts 的角度来看，value 和 onChange 只是 <Child> 的两个属性，所以：
不，更改一个属性 (value) 不一定会导致调用任何回调 (onChange)。

但是在 React 中很常见的是所谓的"controlled-components"，其中状态（即值）保存在父级内部，子级没有任何自己的状态，但会从父级接收值，并且只通知父母有关更改。

在您的示例中，父组件保持状态：

const [value, set_value] = useState({a: 1});

如果需要更改（但不保留任何自己的状态），孩子可能只会收到值并调用回调，例如：

const Child = function( props ){
  return <button onClick={ function(){
    props.onChange( props.value.a + 1 );
  }}>
    { props.value.a }
  </button>
};

【讨论】：