Components
@shadcn/react
@shadcn/helpers
Utilities
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 创建带标签和描述的文本域。
Enter your message below.
import {
Field,
FieldDescription,已禁用#
使用 disabled 属性禁用文本域。要为禁用状态添加样式,请向 Field 组件添加 data-disabled 属性。
import { Field, FieldLabel } from "@/components/ui/field"
import { Textarea } from "@/components/ui/textarea"
无效#
使用 aria-invalid 属性将文本域标记为无效。要为无效状态添加样式,请向 Field 组件添加 data-invalid 属性。
Please enter a valid message.
import {
Field,
FieldDescription,按钮#
配合 Button 使用,创建带提交按钮的文本域。
import { Button } from "@/components/ui/button"
import { Textarea } from "@/components/ui/textarea"
RTL#
要在 shadcn/ui 中启用 RTL 支持,请参阅 RTL 配置指南。
شاركنا أفكارك حول خدمتنا.
"use client"
import * as React from "react"