返回组件列表
数据展示
数据表格
带选择、行操作、状态标记、头像和分页的管理表格。
预览
这里展示的源码与 shadcn 从生成 JSON 安装的源码一致。
Members
A compact table for admin lists, ownership reviews, and account pages.
3 selected
| Member | Role | Status | Plan | Last active | Open row actions | |
|---|---|---|---|---|---|---|
AB Avery Brooksavery@example.com | Owner | Active | Pro | 2m ago | ||
MP Mina Parkmina@example.com | Designer | Invited | Team | 1h ago | ||
NC Noah Chennoah@example.com | Engineer | Active | Pro | Yesterday |
安装
构建 registry 并启动开发服务后，在消费项目中运行这条命令。
安装命令
pnpm dlx shadcn@latest add http://localhost:3000/r/data-table.json源码与依赖
安装前可以确认组件源码路径、registry 依赖和 npm 依赖。
源码路径
registry/default/data-table/data-table.tsxRegistry 依赖
avatarbadgebuttoncardcheckboxdropdown-menupaginationtable
NPM 依赖
lucide-react