记录

Appearance

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:

md
<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": {
    "/soft-exam": [
      {
        "text": "软考笔记",
        "items": [
          {
            "text": "计划",
            "link": "/soft-exam/计划"
          },
          {
            "text": "计算机系统",
            "link": "/soft-exam/计算机系统"
          },
          {
            "text": "程序设计语言",
            "link": "/soft-exam/程序设计语言"
          },
          {
            "text": "知识产权",
            "link": "/soft-exam/知识产权"
          },
          {
            "text": "数据库",
            "link": "/soft-exam/数据库"
          },
          {
            "text": "面向对象",
            "link": "/soft-exam/面向对象"
          },
          {
            "text": "UML",
            "link": "/soft-exam/UML"
          },
          {
            "text": "设计模式",
            "link": "/soft-exam/设计模式"
          },
          {
            "text": "操作系统",
            "link": "/soft-exam/操作系统"
          },
          {
            "text": "结构化开发",
            "link": "/soft-exam/结构化开发"
          },
          {
            "text": "软件工程",
            "link": "/soft-exam/软件工程"
          },
          {
            "text": "信息安全",
            "link": "/soft-exam/信息安全"
          },
          {
            "text": "计算机网络",
            "link": "/soft-exam/计算机网络"
          },
          {
            "text": "数据结构",
            "link": "/soft-exam/数据结构"
          }
        ]
      }
    ]
  },
  "outline": {
    "level": [
      1,
      6
    ],
    "label": "/* 本页目录 */"
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/Bacuuu"
    }
  ],
  "lastUpdated": {
    "text": "最后更新于"
  }
}

Page Data ​

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

Page Frontmatter ​

{
  "outline": "deep"
}

More ​

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

最后更新于: