Badge 徽标

用于展示未读消息数或状态点。

基础用法

import { Badge } from '@airo-ui/react'

function Demo() {
  return (
    <Badge count={5}>
      <button>消息</button>
    </Badge>
  )
}

最大值

import { Badge } from '@airo-ui/react'

function Demo() {
  return (
    <Badge count={100} max={99}>
      <button>消息</button>
    </Badge>
  )
}

仅显示红点

import { Badge } from '@airo-ui/react'

function Demo() {
  return (
    <Badge dot>
      <button>消息</button>
    </Badge>
  )
}

API

Props

名称	类型	默认值	说明
count	number	—	显示的数字
max	number	99	最大值，超出显示为 max+
dot	boolean	false	是否仅显示红点
children	ReactNode	—	包裹的子元素