运行时 API 示例

本页演示了 VitePress 提供的一些运行时 API 的用法。

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

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

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

## 结果

### 主题数据
<pre>{{ theme }}</pre>

### 页面数据
<pre>{{ page }}</pre>

### 页面 Frontmatter
<pre>{{ frontmatter }}</pre>

结果

主题数据

{
  "logo": "/favicon.png",
  "nav": [
    {
      "text": "首页",
      "link": "/"
    },
    {
      "text": "arch",
      "link": "/notes/archlinux/index"
    }
  ],
  "sidebar": {
    "/notes/archlinux/": [
      {
        "text": "Archlinux",
        "collapsible": false,
        "items": [
          {
            "text": "Index",
            "link": "/notes/archlinux/index"
          },
          {
            "text": "安装",
            "link": "/notes/archlinux/install"
          },
          {
            "text": "Gnome",
            "link": "/notes/archlinux/gnome"
          },
          {
            "text": "修改根分区大小",
            "link": "/notes/archlinux/changeRootSize"
          },
          {
            "text": "VS Code 部分快捷键无法生效",
            "link": "/notes/archlinux/vscodeShortCuts"
          },
          {
            "text": "删除系统",
            "link": "/notes/archlinux/deleteOS"
          }
        ]
      }
    ]
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/yoshino-nya"
    },
    {
      "icon": {
        "svg": "<?xml version=\"1.0\"?><svg role=\"img\" viewBox=\"0 0 24 24\" \n        xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M4.5 7.5C5.328 7.5 6 8.172 \n        6 9v10.5c0 .828-.672 1.5-1.5 1.5h-3C.673 21 0 20.328 0 19.5V9c0-.828.673-1.5 \n        1.5-1.5h3zm9-4.5c.828 0 1.5.672 1.5 1.5v15c0 .828-.672 1.5-1.5 1.5h-3c-.827 \n        0-1.5-.672-1.5-1.5v-15c0-.828.673-1.5 1.5-1.5h3zm9 7.5c.828 0 1.5.672 1.5 1.5v7.5c0 \n        .828-.672 1.5-1.5 1.5h-3c-.828 0-1.5-.672-1.5-1.5V12c0-.828.672-1.5 1.5-1.5h3z\"/></svg>"
      },
      "link": "https://codeforces.com/profile/Zhangwuji"
    }
  ],
  "docFooter": {
    "prev": "上一页",
    "next": "下一页"
  },
  "lastUpdatedText": "最后更新于",
  "editLink": {
    "pattern": "https://github.com/yoshino-nya/new_blog/edit/main/docs/:path",
    "text": "在 GitHub 上编辑此页"
  },
  "outline": {
    "label": "页面导航"
  },
  "returnToTopLabel": "回到顶部",
  "sidebarMenuLabel": "菜单",
  "darkModeSwitchLabel": "主题",
  "lightModeSwitchTitle": "切换到浅色模式",
  "darkModeSwitchTitle": "切换到深色模式"
}

页面数据

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

页面 Frontmatter

{
  "outline": "deep"
}

更多

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