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": "前端语言",
      "items": [
        {
          "text": "VitePress",
          "link": "/系统课程/VitePress/00.我为什么学习VitePress"
        }
      ]
    },
    {
      "text": "后端语言",
      "items": [
        {
          "text": "Golang",
          "link": "/系统课程/golang/"
        },
        {
          "text": "Java",
          "link": "/系统课程/java"
        },
        {
          "text": "Python",
          "link": "/系统课程/python"
        }
      ]
    },
    {
      "text": "服务器",
      "items": [
        {
          "text": "Shell",
          "link": "/系统课程/VitePress/00.我为什么学习VitePress"
        },
        {
          "text": "Docker",
          "link": "/系统课程/VitePress/00.我为什么学习VitePress"
        },
        {
          "text": "Mysql",
          "link": "/系统课程/mysql/001.Mysql的脚本实例"
        },
        {
          "text": "Mongo",
          "link": "/系统课程/mongo/001.安装教程"
        },
        {
          "text": "Linux",
          "link": "/系统课程/linux/001.安装教程"
        }
      ]
    },
    {
      "text": "常用工具",
      "link": "/系统课程/tools/001.mac安装nvm教程及使用"
    },
    {
      "text": "关于景云",
      "link": "/关于我们/"
    }
  ],
  "sidebar": {
    "/系统课程/VitePress/": [
      {
        "text": "VitePress",
        "items": [
          {
            "text": "0. 关于教程的说明",
            "link": "/系统课程/VitePress/00.我为什么学习VitePress"
          },
          {
            "text": "1. VitePress介绍和安装",
            "link": "/系统课程/VitePress/01.VitePress介绍及安装"
          }
        ]
      }
    ],
    "/系统课程/mongo/": [
      {
        "text": "mongo",
        "items": [
          {
            "text": "安装教程",
            "link": "/系统课程/mongo/001.安装教程"
          },
          {
            "text": "实例分析",
            "link": "/系统课程/mongo/002.实例分析"
          }
        ]
      }
    ],
    "/系统课程/linux/": [
      {
        "text": "linux",
        "items": [
          {
            "text": "安装教程",
            "link": "/系统课程/linux/001.安装教程"
          },
          {
            "text": "自定义服务脚本",
            "link": "/系统课程/linux/002.自定义服务脚本"
          }
        ]
      }
    ],
    "/系统课程/tools/": [
      {
        "text": "常用工具",
        "items": [
          {
            "text": "Mac安装nvm教程及使用",
            "link": "/系统课程/tools/001.mac安装nvm教程及使用"
          },
          {
            "text": "常用网站",
            "link": "/系统课程/tools/002.常用网站"
          }
        ]
      }
    ],
    "/生活分享/": [
      {
        "text": "生活分享",
        "items": []
      }
    ]
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/vuejs/vitepress"
    }
  ]
}

Page Data

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

Page Frontmatter

{
  "outline": "deep"
}

More

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