组件功能

用于显示状态、标签或数字标记的组件,支持多种颜色、尺寸和样式变体,可配置为常规或胶囊形状。

基础用法

通过 label 设置徽章文本,color 与 variant 控制颜色与样式。

Template 示例:

<Badge label="新功能" color="success" variant="solid" />

效果展示如下:

属性说明

属性名 类型 描述 默认值
label string 徽章文本内容 -
color "secondary" | "success" | "danger" | "warning" | "info" | "discovery" 徽章颜色 "secondary"
variant "solid" | "soft" | "outline" 徽章样式变体 "solid"
size "sm" | "md" | "lg" 徽章尺寸 "md"
pill boolean 是否为胶囊形状 false

注意:

★ 标记为必填属性。

颜色说明

  • secondary:次要/默认颜色

  • success:成功/绿色

  • danger:危险/红色

  • warning:警告/黄色

  • info:信息/蓝色

  • discovery:发现/紫色

样式变体说明

  • solid:实心填充

  • soft:柔和背景

  • outline:边框样式