Skip to content

Runtime API の例

このページでは、VitePress が提供する Runtime API の一部を紹介します。

メイン API である useData() は、現在のページのサイト、テーマ、およびページデータへアクセスできます。.md.vue の両方で機能します。

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

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

## 結果

### テーマデータ
<pre>{{ theme }}</pre>

### ページデータ
<pre>{{ page }}</pre>

### Frontmatter
<pre>{{ frontmatter }}</pre>

結果

テーマデータ

{
  "nav": [
    {
      "text": "ホーム",
      "link": "/ja/"
    },
    {
      "text": "例",
      "link": "/ja/markdown-examples"
    }
  ],
  "sidebar": [
    {
      "text": "Docker",
      "collapsed": false,
      "items": [
        {
          "text": "Dockerの例",
          "link": "/ja/markdown-examples"
        },
        {
          "text": "ランタイムAPIの例",
          "link": "/ja/api-examples"
        }
      ]
    }
  ],
  "outline": {
    "level": "deep",
    "label": "目录"
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/vuejs/vitepress"
    }
  ],
  "search": {
    "provider": "local"
  }
}

ページデータ

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

Frontmatter

{
  "outline": "deep"
}

さらに詳しく

Runtime API 一覧 を参照してください。