内置组件
标注

Callout 组件

向读者显示重要信息的内置组件。

示例

💡
标注是旨在吸引注意力的一小段文本
标注是旨在吸引注意力的一小段文本
⚠️
标注是旨在吸引注意力的一小段文本
🚫
标注是旨在吸引注意力的一小段文本

用法

默认

使用emoji更改默认的图标

💡
SimpleLife在2023年9月3日翻译Nextra官网
import { Callout } from 'nextra/components';
 
<Callout>SimpleLife在2023年9月3日翻译Nextra官网</Callout>;

信息

今天星期天
import { Callout } from 'nextra/components';
 
<Callout type="info">今天星期天</Callout>;

警告

⚠️
这是一条警告信息,请查阅后使用该特性
import { Callout } from 'nextra/components';
 
<Callout type="warning">这是一条警告信息,请查阅后使用该特性</Callout>;

错误

🚫
这是一个危险的特征,可以导致一切爆炸
import { Callout } from 'nextra/components';
 
<Callout type="error">这是一个危险的特征,可以导致一切爆炸</Callout>;

API

Callout组件需要以下属性

type(可选)

  • Type: 'default' | 'info' | 'warning' | 'error'
  • Default: 'default'

emoji(可选)

要在标注中显示的图标。您还可以使用此属性自定义图标。

  • Type: string | ReactNode
  • Default: '💡'

children

标注的内容。

  • Type: ReactNode