跳到主要内容

徽标数

用于在图标、按钮或其他组件上显示一个小红点或数字，提示用户有新信息或待办事项。

何时使用​

  • 用于强调组件的特殊状态或提示信息，例如未读通知、任务待处理等。

一、属性​

1. 功能​

功能设置入口

1）值设置​

支持以下几种方式绑定徽标的值：

  • 手动赋值
  • 数据绑定
  • 视图参数
  • 组件绑定

详见：数据绑定

值绑定示意

2）附加元素形式​

徽标数有两种展示形式：

  • 拖拽设计（默认）：在徽标数容器中拖入其他组件，徽标会显示在该组件右上角。常见于图标与徽标组合。

    拖拽设计示意

  • 独立展示：徽标独立显示，不依附于其他组件，适用于一些无需结合具体组件的提醒场景。

    独立展示示意

附加元素形式设置

2. 数据​

数据设置入口

徽标类型可选择：

  • 徽标数（默认）：展示具体数字

    徽标数展示 徽标数效果

  • 小红点：以小圆点形式提示

    小红点展示 小红点效果

3. 外观​

外观设置入口

  • 徽标颜色：可自定义颜色，不同颜色可用于区分信息类型。

    徽标颜色示意

4. 状态​

无特殊状态设置，详见：通用状态

二、样式​

无特殊样式配置，详见：通用样式

三、常见使用场景​

1. 图标上的消息提示​

用于图标角标提示新消息、更新等状态。

图标消息提示示例

2. 表格/单元格中待办提示​

结合表格使用，提示某一项存在待处理信息。

单元格待处理提示