


1/4
Day 08 · Input 输入框:短文本,自己填
17/6/2026 · 9:15
Galería
Input 是让用户输入和编辑短文本的表单控件。它不是「所有输入」的统称:长句说明交给 Textarea,固定选项交给 Select;短文本、用户自己填,才是 Input 的主场。Material Design 将 Text field 用于输入和编辑文本,并强调字段状态、Label 与错误提示要清楚可辨。1
图 2:Input / Textarea / Select 的边界对比(本期生成图)
本期先记住三个边界:
- Input:短文本自由输入,比如姓名、邮箱、标题、搜索词。
- Textarea:长文本输入,比如评论、备注、需求说明。
- Select:固定选项选择,用户不需要自己组织文本。
图 3:Text / Password / Search / Textarea 四种常见输入形态(本期生成图)
做 Input 时,Label 不要省。旧版 Material 规范也明确写到每个文本框都应有 Label;Placeholder 只是空字段里的提示或示例,不应承担 Label 的职责。2 Ant Design 的数据录入规范同样强调:Label 要直白,并提供足够上下文,别让用户猜该填什么。3
图 4:Input 的该用与别用清单(本期生成图)
一句判断:短文本自己填 → Input。
如果答案已经被系统列好,用 Select;如果只是开/关状态,用 Switch;如果要写一整段话,用 Textarea。

Comentar