运行时 API 示例

本页面演示 VitePress 提供的部分运行时 API 的用法。

主要的 useData() API 可用于访问当前页面的站点、主题和页面数据。它在 .md 和 .vue 文件中均可使用：

<script setup>
import { useData } fromf 'vitepress'

const { theme, page, frontmatter } = useData()
</script>

## 结果

### 主题数据

<pre>{{ theme }}</pre>

### 页面数据

<pre>{{ page }}</pre>

### 页面 Frontmatter

<pre>{{ frontmatter }}</pre>

结果

主题数据

{
  "nav": [
    {
      "text": "主页",
      "link": "/zh/"
    },
    {
      "text": "文学",
      "link": "/zh/literature/",
      "activeMatch": "/zh/literature/"
    }
  ],
  "sidebar": [
    {
      "text": "文学",
      "items": [
        {
          "text": "总览",
          "link": "/zh/literature/"
        },
        {
          "text": "无木",
          "items": [
            {
              "text": "《无木》总览",
              "link": "/zh/literature/WuMu/"
            },
            {
              "text": "名师",
              "link": "/zh/literature/WuMu/FamousTeacher.md"
            }
          ]
        }
      ]
    }
  ],
  "footer": {
    "message": "基于 Apache 许可发布<br>内容纯属虚构，仅供娱乐，请勿过分解读。",
    "copyright": "版权所有 © 2026-至今 料处"
  },
  "docFooter": {
    "prev": "上一页",
    "next": "下一页"
  },
  "outline": {
    "label": "页面导航"
  },
  "lastUpdated": {
    "text": "最后更新于"
  },
  "notFound": {
    "title": "页面未找到",
    "quote": "但如果你不改变方向，并且继续寻找，你可能最终会到达你所前往的地方。",
    "linkLabel": "前往首页",
    "linkText": "带我回首页"
  },
  "langMenuLabel": "多语言",
  "returnToTopLabel": "回到顶部",
  "sidebarMenuLabel": "菜单",
  "darkModeSwitchLabel": "主题",
  "lightModeSwitchTitle": "切换到浅色模式",
  "darkModeSwitchTitle": "切换到深色模式",
  "skipToContentLabel": "跳转到内容",
  "search": {
    "provider": "local",
    "options": {
      "locales": {
        "zh": {
          "translations": {
            "button": {
              "buttonText": "搜索",
              "buttonAriaLabel": "搜索"
            },
            "modal": {
              "displayDetails": "显示详细列表",
              "resetButtonTitle": "重置搜索",
              "backButtonTitle": "关闭搜索",
              "noResultsText": "没有结果",
              "footer": {
                "selectText": "选择",
                "selectKeyAriaLabel": "输入",
                "navigateText": "导航",
                "navigateUpKeyAriaLabel": "上箭头",
                "navigateDownKeyAriaLabel": "下箭头",
                "closeText": "关闭",
                "closeKeyAriaLabel": "Esc"
              }
            }
          }
        }
      }
    }
  },
  "logo": "/logo.svg"
}

页面数据

{
  "title": "运行时 API 示例",
  "description": "",
  "frontmatter": {
    "outline": "deep"
  },
  "headers": [],
  "relativePath": "zh/api-examples.md",
  "filePath": "zh/api-examples.md",
  "lastUpdated": 1773494476000
}

页面 Frontmatter

{
  "outline": "deep"
}

更多

查看文档以获取完整的运行时 API 列表。