@ug666/react 文档演示

Textarea 文本域

Textarea 适合多行说明、反馈、评论或富文本前置输入场景。

导入方式

所有示例均直接使用 @ug666/react 中的真实组件导出。

import { Textarea } from '@ug666/react'

变体预览

基础多行输入与带标签说明。

项目简介

更新说明

建议控制在 100 字以内

状态展示

错误态、帮助说明与禁用态。

反馈内容

只读日志

尺寸展示

可通过 rows 与容器宽度控制展示面积。

短反馈

长文案

代码示例

多行受控输入更适合提交前校验。

import { useState } from 'react'
import { Textarea } from '@ug666/react'

export function FeedbackField() {
  const [value, setValue] = useState('')

  return (
    <Textarea
      label="意见反馈"
      rows={5}
      helperText="最多 500 字"
      value={value}
      onChange={(event) => setValue(event.target.value)}
    />
  )
}

Props 说明

属性	类型	默认值	说明
label	string	—	文本域标签。
error	string	—	错误提示，有值时边框高亮为红色。
helperText	string	—	辅助说明文本。
rows	number	3	默认显示行数。