表格
Table
初级通用表格(Table)是把同类数据按行和列组织起来的内容展示方式,每一列说明一种属性,每一行对应一条记录。它让你能沿着同一列比较多条记录,比如在订单后台对照金额、状态和下单时间。
你可能会说:「我想把后台这些订单排整齐,让人能按金额、状态和时间快速对照。」
动手看看订单后台的最近订单
每一行是一笔订单,每一列是同一种属性。沿着「金额」或「状态」往下看,就能直接比较不同订单;试试悬停、用 Tab 聚焦某一行,再切换表格密度。
基础表格留出了更宽松的行距,适合日常查看和逐条处理订单;悬停反馈能帮你确认自己正在看哪一笔。
要点什么时候一组信息适合放进表格?
- 1
一行对应一条可比较的记录
你做订单后台时,可以让每行对应一笔订单,每列固定展示订单号、金额和状态。因为信息的位置一致,用户往下扫就能比较不同订单。
- 2
列标题说明每个值的含义
同一列里的值最好回答同一个问题,例如「创建时间」列都放时间。这样用户看到某个单元格,就能借助列标题判断它代表什么,而不用逐条猜。
- 3
交互围绕查找和处理记录
当订单很多时,筛选、排序或分页能帮用户缩小范围。若每行还有「查看详情」,它是针对这条记录的操作;表格负责让记录可查、可比,不必塞进所有详情。
- 4
窄屏先保住关键对照信息
表格列多时,手机屏幕放不下。你可以优先保留用户要比较的列,让其他信息进入详情页,或允许横向滚动;关键是用户仍能认出每个值属于哪条记录。
容易混淆的地方
表格和列表都能展示多条内容,但表格强调多条记录在相同字段上的横向、纵向对照;列表更适合逐条阅读标题和摘要。它也不同于卡片:卡片能容纳图片、说明和多个操作,适合浏览单个对象;如果用户主要想比较价格、状态等固定属性,表格通常更直接。
什么时候用
适合用
- 做订单管理页时,客服需要同时查看多笔订单的金额、状态和创建时间,并定位异常订单。
- 做 AI 工具的任务记录页时,用户要对照各次运行的模型、耗时、费用和结果。
- 做成员管理后台时,管理员要按角色或加入时间查找成员,再处理某一行的账号。
不适合用
- 文章页只是按发布时间展示标题和摘要,读者主要逐篇阅读,用列表比表格合适。
- 商品首页以图片和卖点帮助用户浏览,每件商品的信息结构也不完全相同,用卡片更合适。
- 页面只想突出今天的总收入和订单总数,没有多条记录需要对照,用统计数值展示即可。
练一练选一个答案,看看解释
你要做一个 AI 任务后台,用户想快速找出费用最高的几次运行,并对照每次的模型、耗时和结果。哪种展示方式更合适?
让 AI 帮你做复制给 AI Agent 直接用
请为 AI 任务后台制作表格:每行是一条运行记录,列出任务名称、模型、费用、耗时、结果和运行时间。支持按费用排序,并能进入单条记录的详情。窄屏时优先保留名称、费用和结果,确保每个值仍能对应到正确记录。