项目正在快速迭代中,API 与视觉细节可能随版本调整,请勿用于生产环境。
双端兼容 · 桌面 + 移动

StatusTag 状态标签 ​

语义枚举到预设色的状态标签:statuses 声明值到文本/颜色的映射,未命中自动回退兜底色,基于 EbTag 渲染。

映射规则:

  • 命中某项时,文本取该项 label(未配置则回退为值的字符串形式),颜色取该项 type(未配置则回退 info);
  • 未命中任何项时,显示值的字符串形式,颜色用 fallbackType;
  • 本组件无事件与插槽,纯展示,适合在表格列插槽、详情描述插槽里直接复用同一份映射表。

基础用法 ​

启用
禁用
待审核
unknown

命中与回退 ​

数字值同样支持(内部转字符串比较与展示);frozen 命中但未配 label,回退显示原始值且颜色用默认 info;mystery 未命中,走 fallback-type 兜底色并显示原值。

404
frozen
启用
mystery
mystery

尺寸与显示效果 ​

size 控制尺寸,effect 控制填充风格(light 浅底 / plain 描边 / dark 实底)。

启用
启用
启用
启用
启用
启用

在表格中使用 ​

经 DataTable 的列插槽复用同一份映射表,未命中行自动灰底兜底,无需逐行写 if/else。

账户列表
共 0 条
  • 1

与 EbDataTable 结合时,经列插槽使用即可:<template #status="{ row }"><eb-status-tag :value="row.status" :statuses="statuses" /></template>。

映射匹配注意事项:

  • 命中判断是严格相等(===),数字 1 与字符串 '1' 不互等,后端返回类型不稳定时先统一转换;
  • statuses 通常定义为模块级常量,多处表格、详情页共享同一份映射,枚举变更只改一处;
  • 组件内部不做翻译与格式化,未命中显示原值是刻意设计,便于暴露脏数据。

API ​

StatusTag Props

参数说明类型默认值
value当前状态值string | number
statuses映射表,见下方 Statuses 项Statuses[][]
fallbackType未命中兜底色primary | success | warning | info | danger | errorinfo
size尺寸small | default | largesmall
effect显示效果light | plain | darklight

Statuses 项

参数说明类型默认值
value状态值(与 value 严格相等即命中)string | number—
label展示文本,缺省回退为值的字符串形式string—
type预设色primary | success | warning | info | danger | errorinfo

本组件无事件、插槽与实例方法,纯展示。