• Badge 徽标
    • 使用指南
    • 用法
    • 小红点与文本
    • Badge 参数

    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