---
url: /components/badge.md
---
# Badge 徽标

出现在按钮、图标、头像等元素右上角的徽标：`value` 展示数字或文本，`max` 超限显示 max+，`is-dot` 退化为小红点，`standalone` 时脱离子元素作为行内标签独立使用。value 为空且非红点时不渲染。

## 基础用法

数值型 value 超过 `max` 时截断为 max+；字符串 value 原样展示；`hidden` 为 true 时整体隐藏。

## 类型与独立使用

`type` 更换底色（默认 danger 红）；`standalone` 时不包裹子元素，徽标作为行内元素独立渲染，适合直接排在文本后面。

## 红点配色

红点模式（`is-dot`，忽略 value）同样受 `type` 影响，可用于不同优先级的提醒。

## 组合图标与头像

default 插槽可包裹任意元素，徽标自动定位到其右上角。

## 动态显隐

`hidden` 受控切换，徽标隐藏时子元素布局不受影响。

## API