Display an indicator that requires attention.
Show number or text.
Express state in different colors.
For more colors, please refer to the 'Colors' section
Components of different sizes.
Fix the Badge
in the designated position.
Badge.Props
Attribute | Description | Type | Accepted values | Default |
---|---|---|---|---|
type | badge type | NormalTypes | NormalTypes | default |
size | badge size | NormalSizes | NormalSizes | medium |
dot | show dot and ignore content | boolean | - | false |
... | native props | HTMLAttributes | 'alt', 'id', 'className', ... | - |
Badge.Anchor.Props
Attribute | Description | Type | Accepted values | Default |
---|---|---|---|---|
placement | fixe position of Badge | AnchorPlacement | AnchorPlacement | topRight |
... | native props | HTMLAttributes | 'alt', 'id', 'className', ... | - |
NormalTypes
type NormalTypes = 'default' | 'secondary' | 'success' | 'warning' | 'error'
NormalSizes
type NormalSizes = 'medium' | 'mini' | 'small' | 'large'
AnchorPlacement
type AnchorPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight'