解释什么是受控组件和非受控组件

在 React 中，表单元素的管理和处理是一个重要的主题。理解受控组件和非受控组件之间的区别，对构建高效、可维护的用户界面至关重要。本文将深入探讨这两种组件的定义、优缺点、使用场景以及最佳实践。

1. 什么是受控组件？

1.1 定义

受控组件是指在 React 中，表单元素的状态由 React 组件的状态（state）来控制。也就是说，表单元素的值是由 React 的 state 管理的，任何用户输入都会通过事件处理程序更新 state。

1.2 实现

受控组件通常通过以下方式实现：

• 使用 value 属性将表单元素的值与组件的 state 绑定。
• 使用 onChange 事件处理程序来更新 state。

1.3 示例

下面是一个简单的受控组件示例：

import React, {
    useState