数据表格
Data Table
后台的命根子：一列一个字段，表头能排序，行尾有操作，底部分页。
Web 网站桌面客户端数据与工作内容区组件
大白话说明
数据表格为「大量同构数据的查找与处理」而生：表头支持排序与筛选，行支持勾选批量操作，长文本截断、状态用徽章、金额右对齐。密度可调是标配，因为运营和财务看同一张表的耐心完全不同。
什么时候用
记录数超过 20 条、字段超过 4 列、需要对比与批量操作时——它没有对手。
什么时候不用
移动端别硬塞表格：转成卡片列表；字段只有两三个时列表更轻。
细节与变体
- 行内操作超过 2 个必须收进「更多」，否则每行都是一排按钮墙
- 空表格也要保留表头并给空状态说明，别只剩一片白
- 固定第一列或表头吸顶，长表滚动时不迷路
配套提示词（点开填空、复制）
参考实现（开源）
- Ant Design（蚂蚁） ↗ MIT · 免费（MIT）
国内中后台的事实标准：表格、表单、列表都是行业参照物。
- Carbon（IBM） ↗ Apache-2.0 · 免费（Apache-2.0）
IBM 的设计系统：Token 体系与数据密集型界面的标杆，后台产品必读参考。
- MUI（Material UI） ↗ MIT · 免费（MIT，核心）
React 生态最老牌的 Material 组件库：组件全、文档厚、AI 生成命中率最高之一。