Skip to content

Badge 标记

出现在按钮、图标旁的数字或状态标记。

基础用法

展示新消息数量。

12
3
1
2

独立使用

不包裹任何元素既是独立使用,可以定义样式展现。

12
12
99+

最大值

可自定义最大值。由 max 属性定义, 它接受一个 Number,需要注意的是,只有当 value 为 Number 时,它才会生效。

99+
10+

自定义内容

可以显示数字以外的文本内容。定义 value 为 String 类型是时可以用于显示自定义文本。

new
hot

颜色

可以用来标识状态的小圆点。定义 text 为 String 类型以及 color 为 String 颜色值标识状态。

蓝色
红色
绿色
黄色
粉色

Badge API

Badge Attributes

参数名描述类型默认值
value显示值String Number-
max最大值,超过最大值会显示 '{max}+'Number-
is-dot小圆点Booleanfalse
hidden隐藏badgeBooleanfalse
type类型Stringdanger
color自定义小圆点的颜色String-
text在设置了 color 的前提下有效,设置状态点的文本String-