图标右上角的圆形徽标数字。
# 何时使用
一般出现在通知图标或头像的右上角,用于显示需要处理的消息条数,通过醒目视觉形式吸引用户处理。
import { HiBadge } from 'hi-kits/badge'
1
# 基本用法
简单的徽章展示
# 独立使用
不包裹任何元素,增加 standAlone
标签后,即是独立使用,可自定样式展现
Copy
# 讨嫌的小红点
没有具体的数字。
# 状态点
用于表示状态的小圆点。提供五种状态.
Copy
# 参数说明
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
count | 展示的数字 | number | string | - | - |
dot | 不展示数字,只有一个小红点 | boolean | - | false |
badgeStyle | 自定义样式 | string | - | - |
standAlone | 是否独立使用 | boolean | - | false |
status | 设置 h-badge 为状态点 | 'success' | 'processing' | 'default' | 'error' | 'warning' | - | - |
text | 在设置了status 的前提下有效,设置状态点的文本 | string | - | - |