文档仅用于主题展示，最新Vuepress使用文档请前往官方站点
内置组件
Badge badge
Props:
- type
- 类型：
'tip' | 'warning' | 'danger' - 默认值：
'tip'
- 类型：
- text
- 类型：
string - 默认值：
''
- 类型：
- vertical
- 类型：
'top' | 'middle' | 'bottom' | undefined - 默认值：
undefined
- 类型：
- type
示例：
输入
- VuePress - <Badge type="tip" text="v2" vertical="top" />
- VuePress - <Badge type="warning" text="v2" vertical="middle" />
- VuePress - <Badge type="danger" text="v2" vertical="bottom" />
1
2
3
2
3
输出
- VuePress - v2
- VuePress - v2
- VuePress - v2
CodeGroup
详情：
CodeGroupItem 组件的 Wrapper 。
CodeGroupItem
Props:
- title
- 类型：
string - 是否必需：
true
- 类型：
- active
- 类型：
boolean - 默认值：
false
- 类型：
- title
详情：
该组件必须放置在 CodeGroup 组件的内部。
可以通过
activeProp 来设置初始激活的元素。如果不设置，默认激活第一个元素。示例：
输入
<CodeGroup>
<CodeGroupItem title="YARN">
```bash:no-line-numbers
yarn
```
</CodeGroupItem>
<CodeGroupItem title="NPM" active>
```bash:no-line-numbers
npm install
```
</CodeGroupItem>
</CodeGroup>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
输出
yarn
npm install
注意
你必须在 <CodeGroupItem> 的开始标签和代码块之间添加一个空行，否则代码块无法被 Markdown 正确解析。
所有内容首先都必须是合法的 Markdown ，然后才是一个 Vue SFC 。
了解更多： Cookbook > Markdown 与 Vue SFC
或者你可以选择使用 自定义容器 。