文本域 Textarea
用于多行文本输入。
何时使用
- 需要输入多行文本时
- 需要限制字数的文本输入时
- 需要可清除功能的多行文本输入时
示例
基础用法
最简单的文本域用法。
正在加载组件...
不同行数
可以设置不同的行数。
正在加载组件...
可清除文本域
带清除图标的文本域,点击图标清除内容。
正在加载组件...
字数限制
可以设置最大字数限制,并在右下角显示计数。
正在加载组件...
禁用状态
展示禁用状态的文本域。
正在加载组件...
API
Textarea Props
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| rows | 默认行数 | number | 3 |
| clearable | 是否显示清除按钮 | boolean | false |
| onClear | 清除时的回调 | () => void | - |
| disabled | 是否禁用 | boolean | false |
| max | 最大字数限制,设置后显示字数计数 | number | - |
| value | 输入框内容(受控) | string | - |
| defaultValue | 输入框默认内容 | string | - |
| onChange | 输入框内容变化时的回调 | React.ChangeEventHandler<HTMLTextAreaElement> | - |
| onFocus | 输入框获得焦点时的回调 | React.FocusEventHandler<HTMLTextAreaElement> | - |
| onBlur | 输入框失去焦点时的回调 | React.FocusEventHandler<HTMLTextAreaElement> | - |
| className | 自定义类名 | string | - |