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": "Home",
      "link": "/"
    },
    {
      "text": "Examples",
      "link": "/markdown-examples"
    }
  ],
  "sidebar": [
    {
      "text": "ai",
      "items": [
        {
          "text": "ai",
          "link": "/ai/大模型/ai"
        }
      ]
    },
    {
      "text": "es",
      "items": [
        {
          "text": "es",
          "link": "/es/es.md"
        },
        {
          "text": "es1",
          "link": "/es/es1.md"
        }
      ]
    },
    {
      "text": "数据库",
      "items": [
        {
          "text": "MySQL",
          "link": "/db/MySQL.md"
        },
        {
          "text": "Redis",
          "link": "/db/Redis.md"
        },
        {
          "text": "Elasticsearch",
          "link": "/db/Elasticsearch.md"
        }
      ]
    },
    {
      "text": "Java",
      "items": [
        {
          "text": "并发",
          "link": "/java/并发.md"
        },
        {
          "text": "Spring",
          "link": "/java/Spring.md"
        }
      ]
    },
    {
      "text": "微服务",
      "items": [
        {
          "text": "API 网关",
          "items": [
            {
              "text": "网关",
              "link": "/micro/api_gateway/"
            },
            {
              "text": "Spring Cloud Gateway",
              "link": "/micro/api_gateway/spring cloud gateway"
            },
            {
              "text": "Apisix",
              "link": "/micro/api_gateway/apisix"
            }
          ]
        }
      ]
    },
    {
      "text": "云原生",
      "items": [
        {
          "text": "k8s",
          "items": [
            {
              "text": "安装",
              "link": "/k8s/k8s 安装"
            }
          ]
        },
        {
          "text": "k3s 单机部署",
          "link": "/k8s/k3s 单机部署.md"
        }
      ]
    },
    {
      "text": "规范设计",
      "items": [
        {
          "text": "数据库",
          "link": "/norm/数据库规范"
        },
        {
          "text": "git commit",
          "link": "/norm/Git commit 规范"
        }
      ]
    }
  ],
  "footer": {
    "message": "<a href=\"https://beian.miit.gov.cn/\" target=\"_blank\">粤ICP备16045165号</a>",
    "copyright": "Copyright 2022 windtreeland"
  }
}

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.