Badge 徽章

按钮和图标上的数字或状态标记。

TIP

Badge 组件对应 GvBadge，下方示例可直接交互，点击「显示代码」查看源码。

基本用法

可以用来展示新消息的数量, 数量值可接受 Number 或 String。

最大值​

由 max 属性定义，接受 Number 值。 需注意，仅在值也是 Number 时起作用。

自定义显示内容​

可以展示除数字以外想要展示的任何值。 当 value 是 String 时，可以显示自定义文字。

点状徽章

通过一个小红点标记来告知用户有新内容。使用 is-dot 属性。 是个布尔值。

自定义颜色

通过 color 属性自定义徽章的颜色。

零值徽章

当 showZero 为 true 时，徽章会显示为一个点。

API

Attributes

属性名	说明	类型	默认值
value	设置标记数量	number / string	''
max	最大值，超过最大值会显示 {max}+。 只有当 value 是数字类型时起作用。	number	10
isDot	是否为点状徽章	boolean	false
hidden	是否隐藏徽章	boolean	false
type	设置徽章类型	string	warning
showZero	是否显示零值徽章	boolean	false
color	自定义徽章颜色	string	一

Events

无

类型定义

// Badge 类型
type BadgeType = 'primary' | 'success' | 'warning' | 'danger' | 'info';