javascript - React 受控组件与不受控组件的总体定义

Question

我已经使用 React 好几个月了，我已经很清楚来自此类来源的组件的受控和不受控性质

Controlled form inputs
Uncontrolled components

在我偶然发现这篇文章之前，一切都很清楚

Controlled Components

我曾经认为受控与不受控是 React 组件控制状态然后受控，DOM refs 处理然后不受控(使用 refs)

然后，第三篇文章改变了我的观点，即如果组件具有来自任何 React 组件(Parent 或组件本身)的单一真实来源，则组件将受到控制。好的!这意味着 React 组件从父 props 接收或播种值以在构造函数中映射组件本地状态变得不受控制。

如果你看一下文章 3 的两个推荐部分的差异，我唯一可以使黑白控制不受控制的差异是这个

state = { email: this.props.defaultEmail }; //uncontrolled

但是这两篇文章不会让读者混淆受控组件的明确定义吗？还是只有我这样？

我现在不确定我是否真的知道如何解释非受控组件。

或者这只是一个松散的术语？

Answer 1

您必须了解的基本区别是:受控组件 由 React 本身处理。他们消耗组件的 Prop 和状态。在任何事件调用时，React 都会处理合成事件，例如 onChange、onClick。

---

在 Uncontrolled Component 中，我们请求 DOM 来处理组件。就像要求 DOM 通过使用 ref 添加对组件的引用来获取输入值一样。我希望这会在两个组件中做出明确的区分。您可以进一步提问。