文本域

显示表单文本域或类似文本域的组件。

import { Textarea } from "@/components/ui/textarea"

export function TextareaDemo() {

安装


pnpm dlx shadcn@latest add textarea

import { Textarea } from "@/components/ui/textarea"

<Textarea />

使用 Field、FieldLabel 和 FieldDescription 创建带标签和描述的文本域。

import { Field, FieldDescription, FieldLabel } from "@/components/ui/field"
import { Textarea } from "@/components/ui/textarea"

使用 disabled 属性禁用文本域。要为禁用状态添加样式，请向 Field 组件添加 data-disabled 属性。

import { Field, FieldLabel } from "@/components/ui/field"
import { Textarea } from "@/components/ui/textarea"

使用 aria-invalid 属性将文本域标记为无效。要为无效状态添加样式，请向 Field 组件添加 data-invalid 属性。

import { Field, FieldDescription, FieldLabel } from "@/components/ui/field"
import { Textarea } from "@/components/ui/textarea"

配合 Button 使用，创建带提交按钮的文本域。

import { Button } from "@/components/ui/button"
import { Textarea } from "@/components/ui/textarea"