Badge 徽标


在元素右上角展示消息提醒,可用于按钮等组件。

使用指南

在 Taro 文件中引入组件

:::demo

  1. import { AtBadge } from 'taro-ui'

:::

用法

:::demo

  1. <AtBadge value='10' maxValue='99'>
  2. <AtButton size='small'>按钮</AtButton>
  3. </AtBadge>

:::

小红点与文本

:::demo

  1. <AtBadge dot>
  2. <AtButton size='small'>按钮</AtButton>
  3. </AtBadge>
  4. <AtBadge value='NEW'>
  5. <AtButton size='small'>按钮</AtButton>
  6. </AtBadge>
  7. <AtBadge value={'···'}>
  8. <AtButton size='small'>按钮</AtButton>
  9. </AtBadge>

:::

Badge 参数

参数 说明 类型 可选值 默认值
dot 角标红点 Boolean - false
value 角标数字 Number - -
maxValue 角标最大值 Number - 99