第 9 课：受控输入框

• 日期：2026-09-10
• 课程序号：第 9 课
• 知识点：value、onChange 与状态

用途

让输入内容由 React 状态统一管理。

核心概念

value 来自状态，输入事件更新同一状态。

最小代码或操作示例

const [title, setTitle] = useState('')
return <input value={title} onChange={e => setTitle(e.target.value)} />

3～5 分钟练习

在输入框下方显示字符数。

参考答案

渲染 <p>已输入 {title.length} 个字符</p>。

与上一课的联系

上一课渲染列表；本课管理新增项的输入状态。