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

{
  "logo": "/logo.png",
  "nav": [
    {
      "text": "Home",
      "link": "/"
    },
    {
      "text": "API Documentation",
      "link": "/api-generate-khqr"
    }
  ],
  "sidebar": [
    {
      "text": "API Documentation",
      "items": [
        {
          "text": "Generate KHQR Code",
          "link": "/api-generate-khqr"
        },
        {
          "text": "Generate KHQR (With Merchant)",
          "link": "/api-generate-with-merchant"
        },
        {
          "text": "Check KHQR Status",
          "link": "/api-check-khqr"
        },
        {
          "text": "Decode KHQR Code",
          "link": "/api-decode-khqr"
        },
        {
          "text": "Verify KHQR Code",
          "link": "/api-verify-khqr"
        },
        {
          "text": "Webhook Integration",
          "link": "/webhook-integration"
        }
      ]
    }
  ],
  "socialLinks": [
    {
      "icon": {
        "svg": "<svg role=\"img\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M12 0C5.371 0 0 5.371 0 12c0 6.628 5.371 12 12 12s12-5.372 12-12C24 5.371 18.629 0 12 0zm5.817 7.05c.105 0 .338.024.49.158.122.108.156.255.173.358.017.103.038.338.021.52-.184 1.937-.983 6.638-1.388 8.795-.172.92-.511 1.229-.84 1.262-.714.067-1.258-.471-1.951-.923-1.084-.712-1.697-1.154-2.753-1.848-1.217-.8-.428-1.24.266-1.958.182-.19 3.338-3.063 3.4-3.323.008-.034.016-.16-.06-.226-.076-.065-.188-.043-.269-.025-.115.025-1.943 1.237-5.487 3.636-.52.357-.989.532-1.409.522-.463-.01-1.353-.261-2.016-.477-.812-.264-1.456-.404-1.4-.853.029-.232.349-.471.959-.718 3.76-1.638 6.268-2.716 7.534-3.242 3.586-1.49 4.331-1.751 4.812-1.761z\"/></svg>"
      },
      "link": "https://t.me/GaryThe_Snail"
    },
    {
      "icon": {
        "svg": "<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M2 4h20v16H2V4zm2 2v.511l8 5.333 8-5.333V6H4zm16 12V9.156l-8 5.333-8-5.333V18h16z\"/></svg>"
      },
      "link": "mailto:danet.reab@gmail.com"
    }
  ]
}

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.