جدول
tableکامپوننتستونها از راست، مبلغها با تومان، سطرها با هاور.
| شماره | مشتری | مبلغ | وضعیت |
|---|---|---|---|
| #۱۴۰۵۲ | مریم احمدی | ۲٬۸۹۰٬۰۰۰ تومان | پرداختشده |
| #۱۴۰۵۱ | علی رضایی | ۶۴۰٬۰۰۰ تومان | در انتظار |
| #۱۴۰۵۰ | نگار کریمی | ۱٬۲۱۵٬۰۰۰ تومان | ارسالشده |
نصب
با CLI
اگر هنوز init نکردهاید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور قطعه و وابستگیهایش را مینویسد.
$ npx vibefarsi add tableنصب دستی
محتوای تب «کد» را در
components/ui/table.tsxبگذارید.$ npm i lucide-reactکپی کل فایلregistry json
استفاده
usage.tsx
1import { Table, TableHeader, TableBody, TableRow, TableHead, TableCell } from "@/components/ui/table"23<Table>4 <TableHeader><TableRow><TableHead>مشتری</TableHead><TableHead>مبلغ</TableHead></TableRow></TableHeader>5 <TableBody>6 <TableRow><TableCell>مریم احمدی</TableCell><TableCell numeric>{formatToman(2_890_000)}</TableCell></TableRow>7 </TableBody>8</Table>پراپها
| پراپ | نوع | پیشفرض | توضیح |
|---|---|---|---|
| numeric | boolean | - | روی TableCell: ارقام همعرض برای ستون مبلغ. |