Runtime API Examples

This page demonstrates usage of some of the runtime APIs provided by VitePress.

The main useData() API can be used to access site, theme, and page data for the current page. It works in both .md and .vue files:

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

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

## Results

### Theme Data
<pre>{{ theme }}</pre>

### Page Data
<pre>{{ page }}</pre>

### Page Frontmatter
<pre>{{ frontmatter }}</pre>

Results

Theme Data

{
  "nav": [
    {
      "text": "首页",
      "link": "/"
    },
    {
      "text": "Linux 指南",
      "link": "/linux-backlight-guide"
    },
    {
      "text": "开源项目",
      "items": [
        {
          "text": "GitHub",
          "link": "https://github.com/hajimi/my-docs"
        },
        {
          "text": "贡献指南",
          "link": "https://github.com/hajimi/my-docs/blob/main/CONTRIBUTING.md"
        }
      ]
    }
  ],
  "sidebar": [
    {
      "text": "Linux 笔记本配置",
      "items": [
        {
          "text": "双显卡背光控制避坑指南",
          "link": "/linux-backlight-guide"
        },
        {
          "text": "显卡混合模式配置",
          "link": "/gpu-hybrid-setup"
        }
      ]
    },
    {
      "text": "VitePress 示例",
      "items": [
        {
          "text": "Markdown 示例",
          "link": "/markdown-examples"
        },
        {
          "text": "API 示例",
          "link": "/api-examples"
        }
      ]
    },
    {
      "text": "关于项目",
      "items": [
        {
          "text": "贡献指南",
          "link": "https://github.com/hajimi/my-docs/blob/main/CONTRIBUTING.md"
        },
        {
          "text": "更新日志",
          "link": "https://github.com/hajimi/my-docs/blob/main/CHANGELOG.md"
        },
        {
          "text": "安全政策",
          "link": "https://github.com/hajimi/my-docs/blob/main/SECURITY.md"
        }
      ]
    }
  ],
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/hajimi/my-docs"
    }
  ],
  "footer": {
    "message": "基于 MIT 许可发布 · 拥抱开源精神",
    "copyright": "Copyright © 2025-present Hajimi · 交流分享，共同进步"
  },
  "editLink": {
    "pattern": "https://github.com/hajimi/my-docs/edit/main/docs/:path",
    "text": "在 GitHub 上编辑此页"
  },
  "lastUpdated": {
    "text": "最后更新",
    "formatOptions": {
      "dateStyle": "full",
      "timeStyle": "short"
    }
  },
  "docFooter": {
    "prev": "上一页",
    "next": "下一页"
  }
}

Page Data

{
  "title": "Runtime API Examples",
  "description": "",
  "frontmatter": {
    "outline": "deep"
  },
  "headers": [],
  "relativePath": "api-examples.md",
  "filePath": "api-examples.md",
  "lastUpdated": 1767602921000
}

Page Frontmatter

{
  "outline": "deep"
}

More

Check out the documentation for the full list of runtime APIs.