徽章组件

使用 <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

徽章的语义颜色。可用选项：success、note、tip、warning、error、info、launch、check

minimal

booleanDefaults to false

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

outlined

booleanDefaults to false

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

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>

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>