运行时 API 示例
本页面演示了 VitePress 提供的一些运行时 API 的使用。
主要的 useData() API 可用于访问当前页面的站点、主题和页面数据。
它适用于.md和.vue文件：
md
<script setup>
import { useData } from 'vitepress'
const { theme, page, frontmatter } = useData()
</script>
## 输出结果
### 主题数据
<pre>{{ theme }}</pre>
### 页面数据
<pre>{{ page }}</pre>
### Page Frontmatter
<pre>{{ frontmatter }}</pre>输出结果
主题数据
{
"siteTitle": "酸菜鱼记",
"logo": "/logo.png",
"logoLink": "/",
"langMenuLabel": "多语言",
"returnToTopLabel": "回到顶部",
"sidebarMenuLabel": "菜单",
"darkModeSwitchLabel": "主题",
"lightModeSwitchTitle": "切换到浅色模式",
"darkModeSwitchTitle": "切换到深色模式",
"notFound": {
"title": "页面未找到",
"quote": "抱歉，我们无法找到您正在寻找的页面。",
"linkLabel": "返回首页",
"linkText": "返回首页",
"code": "404"
},
"nav": [
{
"text": "首页",
"link": "/"
},
{
"text": "Markdown",
"link": "/zh/vitepress/markdown扩展"
}
],
"sidebar": [
{
"text": "导航",
"link": "/zh/导航/导航.md"
},
{
"text": "开发知识",
"collapsed": true,
"items": [
{
"text": "JWT",
"link": "/zh/开发知识/JWT"
}
]
},
{
"text": "Vitepress 使用",
"collapsed": true,
"items": [
{
"text": "Markdown扩展",
"link": "/zh/vitepress/Markdown扩展"
},
{
"text": "在Markdown使用Vue",
"link": "/zh/vitepress/在Markdown使用Vue"
},
{
"text": "资源处理",
"link": "/zh/vitepress/资源处理"
},
{
"text": "vitepress API",
"link": "/zh/vitepress/vitepress-API"
},
{
"text": "vitepress图片预览",
"link": "/zh/vitepress/vitepress图片预览"
}
]
},
{
"text": "编程语言",
"items": [
{
"text": "Rust",
"collapsed": true,
"items": [
{
"text": "常用依赖",
"link": "/zh/编程语言/rust/常用依赖"
},
{
"text": "env环境变量",
"link": "/zh/编程语言/rust/env环境变量"
},
{
"text": "Acitx-web",
"link": "/zh/编程语言/rust/Acitx-web"
}
]
},
{
"text": "Python",
"collapsed": true,
"items": [
{
"text": "安装",
"link": "/zh/编程语言/python/安装/centos7"
},
{
"text": "常用",
"link": "/zh/编程语言/python/常用"
},
{
"text": "虚拟环境",
"items": [
{
"text": "pyenv使用",
"link": "/zh/编程语言/python/虚拟环境/pyenv使用"
},
{
"text": "conda使用",
"link": "/zh/编程语言/python/虚拟环境/conda使用"
}
]
},
{
"text": "数据库迁移工具",
"items": [
{
"text": "alembic",
"link": "/zh/编程语言/python/数据库迁移工具/alembic"
}
]
}
]
}
]
},
{
"text": "服务",
"items": [
{
"text": "docker",
"collapsed": true,
"items": [
{
"text": "docker使用",
"link": "/zh/服务/docker/docker使用"
}
]
},
{
"text": "Nginx",
"collapsed": true,
"items": [
{
"text": "安装",
"link": "/zh/服务/Nginx/安装"
},
{
"text": "Nginx使用",
"link": "/zh/服务/Nginx/Nginx使用"
}
]
},
{
"text": "Git",
"collapsed": true,
"items": [
{
"text": "Git使用",
"link": "/zh/服务/Git/Git使用.md"
},
{
"text": "Git问题处理",
"link": "/zh/服务/Git/Git问题处理"
},
{
"text": "Gitea私有化部署",
"link": "/zh/服务/Git/Gitea私有化部署"
},
{
"text": "Gitlab私有化部署",
"link": "/zh/服务/Git/Gitlab私有化部署"
}
]
},
{
"text": "CI&CD(自动化构建部署)",
"collapsed": true,
"items": [
{
"text": "Jenkins",
"link": "/zh/服务/CI&CD(自动化构建部署)/Jenkins使用.md"
},
{
"text": "Jenkins问题处理.md",
"link": "/zh/服务/CI&CD(自动化构建部署)/Jenkins问题处理.md"
}
]
}
]
},
{
"text": "前端开发",
"items": [
{
"text": "Sqlite",
"link": "/zh/前端/Sqlite"
},
{
"text": "npm",
"link": "/zh/前端/npm"
},
{
"text": "pnpm",
"link": "/zh/前端/pnpm"
}
]
},
{
"text": "桌面开发",
"items": [
{
"text": "Electron",
"collapsed": true,
"items": [
{
"text": "常见问题",
"link": "/zh/桌面开发/Electron/常见问题"
},
{
"text": "保存文件",
"link": "/zh/桌面开发/Electron/保存文件至指定目录"
},
{
"text": "打开文件",
"link": "/zh/桌面开发/Electron/打开文件或目录"
}
]
},
{
"text": "Tauri",
"collapsed": true,
"items": [
{
"text": "使用",
"link": "/zh/桌面开发/Tauri/Tauri使用"
}
]
}
]
},
{
"text": "linux",
"items": [
{
"text": "常规",
"collapsed": true,
"items": [
{
"text": "常用命令",
"link": "/zh/linux/常规/常用命令"
},
{
"text": "vi和vim",
"link": "/zh/linux/常规/vi和vim"
}
]
},
{
"text": "ubuntu",
"collapsed": true,
"items": [
{
"text": "设置中文",
"link": "/zh/linux/ubuntu/设置中文"
},
{
"text": "编译软件包前提",
"link": "/zh/linux/ubuntu/编译软件包前提"
}
]
},
{
"text": "centos",
"collapsed": true,
"items": [
{
"text": "离线安装依赖",
"link": "/zh/linux/centos/离线安装依赖"
}
]
}
]
},
{
"text": "工具",
"collapsed": true,
"items": [
{
"text": "字体库",
"link": "/zh/工具/字体库"
},
{
"text": "内网穿透",
"link": "/zh/工具/内网穿透"
},
{
"text": "SSL自动续期",
"link": "/zh/工具/SSL自动续期"
},
{
"text": "SSL自签名证书",
"link": "/zh/工具/SSL自签名证书"
},
{
"text": "安全传输",
"link": "/zh/工具/安全传输"
}
]
}
],
"socialLinks": [
{
"icon": "gitee",
"link": "https://gitee.com/code_yu"
}
],
"editLink": {
"pattern": "http://git.liqianliang.cn/liqianliang/note/src/branch/main/docs/:path",
"text": "编辑此页面"
},
"footer": {
"message": "个人收集整理, MIT License",
"copyright": "Copyright © 2024-2025 <a href=\"https://gitee.com/code_yu\">良</a>"
},
"outline": {
"label": "本页目录",
"level": "deep"
},
"docFooter": {
"prev": "上一页",
"next": "下一页"
},
"lastUpdated": {
"text": "最后更新于",
"formatOptions": {
"dateStyle": "short",
"timeStyle": "medium"
}
},
"search": {
"provider": "local",
"options": {
"translations": {
"button": {
"buttonText": "搜索文档",
"buttonAriaLabel": "搜索文档"
},
"modal": {
"noResultsText": "无法找到相关结果",
"resetButtonTitle": "清除查询条件",
"footer": {
"selectText": "选择",
"navigateText": "切换",
"closeText": "关闭",
"closeKeyAriaLabel": "关闭建"
}
}
}
}
}
}页面数据
{
"title": "运行时 API 示例",
"description": "",
"frontmatter": {
"outline": "deep"
},
"headers": [],
"relativePath": "zh/vitepress/vitepress-API.md",
"filePath": "zh/vitepress/vitepress-API.md",
"lastUpdated": 1736943143000
}Page Frontmatter
{
"outline": "deep"
}顶部导航栏设置
js
export default {
themeConfig: {
nav: [
{ text: 'Guide', link: '/guide' },
{
text: 'Dropdown Menu',
items: [
{ text: 'Item A', link: '/item-1' },
{ text: 'Item B', link: '/item-2' },
{ text: 'Item C', link: '/item-3' }
]
}
]
}
}外链
js
export default {
themeConfig: {
nav: [
{
text: 'Merchandise',
link: 'https://www.thegithubshop.com/',
target: '_self',
rel: 'sponsored'
}
]
}
}其他
Check out the documentation for the full list of runtime APIs.