Textarea 多行输入

收集需要换行、审阅或补充上下文的较长文本。

Beta

示例

直接操作示例,查看组件在具体任务中的状态与反馈。

宿主持有本地发布说明、字数与校验结果;组件负责多行输入和状态表达。
受控发布说明
37 / 120;发布说明可以提交。
状态
控件密度和可见行数分别决定输入高度与初始阅读空间。
只读内容可选择,禁用内容不可编辑,错误状态提示需要修正。

使用建议

用于需要换行的内容

说明、备注和长描述适合 Textarea;单行标识、搜索词仍应使用 Input。

给出预期长度

通过标签或说明明确用途和长度预期,必要时由宿主显示字符计数和剩余量。

保留用户调整空间

根据典型内容设置初始 rows,并允许用户在长内容场景中调整输入区域。

引入方式

从已验证的公开子路径导入组件;全局样式接入方式见安装指南。

import { BaseTextarea } from '@inf-monkeys-tech/monkeys-design/components/base';

当前限制

  • Textarea 不内置字符计数、自动扩高或富文本能力;长度策略与内容校验由宿主应用负责。
  • Deterministic visual evidence is pending T17/T23.
export interface BaseTextareaProps
  extends Omit<
    TextareaHTMLAttributes<HTMLTextAreaElement>,
    'className' | 'disabled' | 'readOnly' | 'style'
  > {
  invalid?: boolean;
  disabled?: boolean;
  readOnly?: boolean;
  controlSize?: BaseControlSize;
  appearance?: BaseAppearance;
  className?: string;
  classNames?: Pick<BaseControlClassNames, 'control'>;
  style?: CSSProperties;
}
属性说明类型默认值
invalid是否进入无效状态并应用相应的校验样式与语义。booleanfalse
disabled是否禁用该组件及其可交互行为。booleanfalse
readOnly是否将控件设为只读,同时保留聚焦与内容读取能力。booleanfalse
controlSize内部表单控件使用的预设尺寸。BaseControlSize
appearance覆盖组件使用的外观令牌或局部样式配置。BaseAppearance
className追加到组件根元素的 CSS 类名。string
classNames按组件公开的结构插槽分别追加 CSS 类名。Pick<BaseControlClassNames, 'control'>
style追加到组件根元素的内联样式。CSSProperties