Skip to content

列表

概述

最基础的列表展示,可承载文字、列表、图片、段落,常用于后台数据展示页面。

  • 图片元素(可选) :如图标/图片,帮助用户更容易定位到需要找到的信息
  • 正文内容(必选) :主要内容,文字可展示为一行或多行
  • 行动按钮(可选) :图标按钮或文字按钮,对本行列表内容进行操作

使用建议

何时使用

  • 何时使用聚合同类信息内容,方便快速浏览和查询

何时不使用

  • 当列表内包含多种类型内容,需要复杂的后台分类筛选和管理时,建议使用 表格 而非 列表。
  • 当列表更加突出“分类”而非“具体的内容本身”,同类内容有明确的分类标题时,建议使用 折叠面板 而非 列表。

布局

列表内重要信息居左,次要信息居右

文本规则

  • 列表标题尽量简短明确,标题避免超过一行
  • 若文案被截断(例如三行之后使用省略符号),鼠标悬浮后使用文字气泡展示全部内容
  • 若列表内包含行动按钮,按钮文案避免过长,避免超过三个按钮;若业务需要多个按钮,可将次要按钮收起

基础类型




尺寸

状态

关联组件

折叠面板

表格