运行时 API 示例

更新: 5/11/2025 字数: 0 字 时长: 0 分钟

本页展示了 VitePress 提供的部分运行时 API 的使用方法。

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

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

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

## 结果

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

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

### 页面前置信息
<pre>{{ frontmatter }}</pre>

结果

主题数据

{
  "logo": "/logo.jpg",
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com"
    }
  ],
  "lastUpdated": {
    "text": "最后更新于",
    "formatOptions": {
      "dateStyle": "short",
      "timeStyle": "medium"
    }
  },
  "nav": [
    {
      "text": "学习",
      "link": "/01_学习/"
    },
    {
      "text": "示例",
      "link": "/00_示例/"
    },
    {
      "text": "导航",
      "link": "/nav/"
    },
    {
      "text": "教程",
      "link": "https://vitepress.yiov.top/",
      "noIcon": false
    }
  ],
  "sidebar": {
    "/01_学习/": [
      {
        "text": "概览",
        "link": "/01_学习"
      },
      {
        "text": "01.基础",
        "link": "/01_学习/01.基础"
      }
    ],
    "/00_示例/": [
      {
        "text": "概览",
        "link": "/00_示例"
      },
      {
        "text": "api-examples",
        "link": "/00_示例/api-examples"
      },
      {
        "text": "markdown-examples",
        "link": "/00_示例/markdown-examples"
      }
    ]
  },
  "editLink": {
    "pattern": "https://github.com/ccoc-cc/vitepress-learn",
    "text": "在GitHub编辑"
  },
  "docFooter": {
    "prev": "上一篇",
    "next": "下一篇"
  },
  "darkModeSwitchLabel": "切换主题",
  "sidebarMenuLabel": "菜单",
  "outlineTitle": "页面内容",
  "returnToTopLabel": "返回顶部",
  "footer": {
    "message": "这是页面底部信息",
    "copyright": "Copyright © 2019-2025 ccoc.cc"
  },
  "search": {
    "provider": "local",
    "options": {
      "translations": {
        "button": {
          "buttonText": "搜索文档",
          "buttonAriaLabel": "搜索文档"
        },
        "modal": {
          "resetButtonTitle": "清除查询条件",
          "resetButtonAriaLabel": "清除查询条件",
          "cancelButtonText": "取消",
          "cancelButtonAriaLabel": "取消",
          "startScreen": {
            "recentSearchesTitle": "搜索历史",
            "noRecentSearchesText": "没有搜索历史",
            "saveRecentSearchButtonTitle": "保存至搜索历史",
            "removeRecentSearchButtonTitle": "从搜索历史中移除",
            "favoriteSearchesTitle": "收藏",
            "removeFavoriteSearchButtonTitle": "从收藏中移除"
          },
          "errorScreen": {
            "titleText": "无法获取结果",
            "helpText": "你可能需要检查你的网络连接"
          },
          "footer": {
            "selectText": "选择",
            "navigateText": "切换",
            "closeText": "关闭"
          },
          "noResultsScreen": {
            "noResultsText": "无法找到相关结果",
            "suggestedQueryText": "你可以尝试查询",
            "reportMissingResultsText": "你认为该查询应该有结果？",
            "reportMissingResultsLinkText": "点击反馈"
          }
        }
      }
    }
  },
  "notFound": {
    "title": "页面未找到",
    "quote": "哎呀，您好像迷失在网络的小胡同里啦，别着急，赶紧回头是岸！",
    "linkText": "返回首页"
  }
}

页面数据

{
  "title": "运行时 API 示例",
  "description": "",
  "frontmatter": {
    "0": "大",
    "1": "纲",
    "2": "：",
    "3": "深",
    "4": "度"
  },
  "headers": [],
  "relativePath": "00_示例/api-examples.md",
  "filePath": "00_示例/api-examples.md",
  "lastUpdated": 1746955650000
}

页面前置信息

{
  "0": "大",
  "1": "纲",
  "2": "：",
  "3": "深",
  "4": "度"
}

更多内容

请查阅 完整的运行时 API 列表 的文档。