表格Table
你可能会说
订单数据堆在一起太乱了,帮我排成表格,一行一条。
表格是按行和列展示同一组字段、便于比较多条记录的数据组件订单、成员和库存可放进表格逐列比较。排序、筛选和分页需明确反馈当前状态;列很多时还要处理小屏和横向滚动。
组成结构 · Anatomy
项目状态负责人
官网改版进行中林小hu
整张表:一个表头 + 若干数据行
说明每列含义,排序入口也在这
一行就是一条记录
行列交叉的最小格子,内容要克制
常见变体 · Variants
基础表格Basic
名称库存
键盘210
鼠标86
数据量不大、没有特殊需求时的默认选择
斑马纹Striped
名称库存
键盘210
鼠标86
行数较多时,使用条纹帮助区分相邻行
紧凑Compact
名称库存
键盘210
鼠标86
显示器42
一屏要塞进更多行的密集后台场景
带排序Sortable
名称价格 ↑
键盘¥99
鼠标¥199
用户需要按某列大小快速找目标时
典型使用场景
后台用户管理
用户角色状态
林小hu管理员正常
阿油成员已禁用
订单列表
全部待付款待发货已完成
订单号商品金额状态
2026071801无线耳机¥ 299.00待付款
2026071796机械键盘¥ 199.00待发货
数据报表
7 月销售报表
周次销售额 ↓订单数环比
第 29 周¥ 286,4003,146↑ 12.5%
第 28 周¥ 254,6002,903↓ 3.2%
操作日志
操作日志
时间操作人操作
14:32:05林小hu发布了「官网改版 v2」
14:28:41阿油删除了文件 旧版首页.sketch
13:56:12KK修改了成员权限
延伸阅读 · 权威出处