徽章组件

以 Markdown 格式查看

使用 <Badge> 组件来显示小块信息,例如状态指示器、类别、版本或发布日期。要显示更长的注释,请使用标注

用法

Plant Care API v2.1.0 新功能

Markdown
1### Plant Care API <Badge intent="info">v2.1.0</Badge> <Badge intent="launch" minimal>新功能</Badge>

变体

意图

成功备注提示警告错误信息发布检查
Markdown
1<Badge intent="success">成功</Badge>
2<Badge intent="note">备注</Badge>
3<Badge intent="tip">提示</Badge>
4<Badge intent="warning">警告</Badge>
5<Badge intent="error">错误</Badge>
6<Badge intent="info">信息</Badge>
7<Badge intent="launch">发布</Badge>
8<Badge intent="check">检查</Badge>

样式

成功徽章,简约样式错误徽章,简约样式成功徽章,描边样式错误徽章,描边加简约样式
Markdown
1<Badge intent="success" minimal>成功徽章,简约样式</Badge>
2<Badge intent="error" minimal>错误徽章,简约样式</Badge>
3<Badge intent="success" outlined>成功徽章,描边样式</Badge>
4<Badge intent="error" minimal outlined>错误徽章,描边加简约样式</Badge>

属性

intent
stringRequired

徽章的语义颜色。可用选项:successnotetipwarningerrorinfolaunchcheck

minimal
booleanDefaults to false

使用更微妙的背景样式显示徽章。可与 outlined 结合使用。

outlined
booleanDefaults to false

使用带边框的轮廓样式显示徽章。可与 minimal 结合使用。