Badge 徽标

用于在图标、按钮或文本旁展示数量、状态点和提醒信息；既可以单独展示，也可以包裹其他内容并固定到右上角。

示例

基础用法

小红点

偏移量

显隐与最大值

API

Props

属性名	说明	类型	默认值
dot	是否展示为小红点	boolean	false
offset	徽标偏移量，格式为 [x, y]，分别表示水平和垂直偏移	[number, number]	[0, 0]
value	徽标内容	number | string	''
max	最大值，value 为数字且超过后显示为 max+	number	99
zero	值为 0 或 '0' 时是否显示徽标	boolean	true
visible	是否显示徽标	boolean	true

Events

该组件无自定义事件。

Slots

插槽名	说明	作用域参数
default	徽标包裹的内容	-

注意事项

• 设置默认插槽后，徽标内容会固定在包裹内容的右上角。
• dot 为 true 时不展示 value 文本。
• zero 为 false 且 value 为 0 或 '0' 时，徽标内容为空并隐藏。
• visible 为 false 时强制隐藏徽标。
• 数字提醒建议设置合理的 max，避免占用过多空间。
• 仅表达状态时优先使用 dot，减少界面噪音。