文章组件是 HTML 排版标签的替代品。文章组件提供了一种简便的方式来自定义内容界面。
要覆盖文章组件,请在项目的 components/content/ 目录下创建同名组件(例如:components/content/ProseA.vue)。
@nuxtjs/mdc 的一部分。ProseA[文章组件](/docs/components/prose)
ProseBlockquote> 块引用
块引用
ProsePre ```js [file.js]{2} meta-info=val
export default () => {
console.log('代码块')
}
```
export default () => {
console.log('代码块')
}
组件属性示例如下:
{
code: "export default () => {\n console.log('代码块')\n}"
language: "js"
filename: "file.js"
highlights: [2]
meta: "meta-info=val"
}
有关语法高亮的更多内容,请查看高亮选项。
],需要用两个反斜杠进行转义:\\]。这是必须的,因为 JS 会自动转义字符串中的反斜杠,导致 \] 变成 ],从而破坏正则表达式。ProseCode`code`
`const code: string = 'highlighted code inline'`{lang="ts"}
code
const code: string = 'highlighted code inline'
ProseH1# H1 标题
ProseH2## H2 标题
ProseH3### H3 标题
ProseH4#### H4 标题
ProseH5##### H5 标题
ProseH6###### H6 标题
ProseHr下方分隔线。
---
上方分隔线。
下方分隔线。
上方分隔线。
ProseImg
ProseUl- 只是
- 一个
- 无序
- 列表
ProseLi- 列表项
ProseOl1. Foo
2. Bar
3. Baz
ProseP仅仅是一段文字。
ProseStrong**仅仅是一段加粗文字。**
ProseEm_仅仅是一段斜体文字。_
ProseTable| 键 | 类型 | 描述 |
| --- | --------- | --------- |
| 1 | 极好 | 表格 |
| 2 | 极好 | 数据 |
| 3 | 极好 | 网站 |
| 键 | 类型 | 描述 |
|---|---|---|
| 1 | 极好 | 表格 |
| 2 | 极好 | 数据 |
| 3 | 极好 | 网站 |
ProseTbody包含在 ProseTable 示例中。
ProseTd包含在 ProseTable 示例中。
ProseTh包含在 ProseTable 示例中。
ProseThead包含在 ProseTable 示例中。
ProseTr包含在 ProseTable 示例中。