Count 计数Count
挂在图标、标签旁边的小数字：未读数、购物车件数、待办数量。数字变化时会滚动替换并鼓一下，提醒人注意。
基本用法
value 为 0 时默认不渲染；超过 max（默认 99）显示成“99+”。
34299+999+0
颜色
accent（默认）用于一般的未读数；danger 用于需要处理的问题；neutral 用于不需要强调的数量。
555
变化时的动效
数字变大时新值自下而上滚入，变小时自上而下；同时徽标放大到 1.35 再回弹。减到 0 时整个徽标消失。
通知3 条未读通知
规格
- 数字
- 旧值 150ms 滚出，新值 spring 滚入
- 徽标
- scale 1 → 1.35 → 1 回弹
- 封顶
- 超过 max 显示“max+”
接口
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
value* | number | — | 数量。 |
max | number | 99 | 超过后显示成“99+”。 |
showZero | boolean | — | 0 也显示，默认不显示。 |
tone | 'accent' | 'danger' | 'neutral' | 'accent' | 颜色。 |
label | string | — | 给读屏的完整说法，如“3 条未读通知”。不传只读出数字。 |
无障碍
- 光一个数字对读屏用户没有意义，请传
label说明这是什么的数量；传了之后可见的数字对读屏隐藏，只读 label。 - 组件本身不是 live region，数字变化不会自动播报。需要播报时放进
role="status"的容器；挂在按钮上时更推荐把数量写进按钮的名字。 - 不可聚焦，没有键盘操作。开了减弱动效时滚动和回弹都会跳过。