|
|
@@ -0,0 +1,49 @@
|
|
|
+---
|
|
|
+outline: deep
|
|
|
+---
|
|
|
+
|
|
|
+# 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>
|
|
|
+```
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { useData } from 'vitepress'
|
|
|
+
|
|
|
+const { site, theme, page, frontmatter } = useData()
|
|
|
+</script>
|
|
|
+
|
|
|
+## Results
|
|
|
+
|
|
|
+### Theme Data
|
|
|
+<pre>{{ theme }}</pre>
|
|
|
+
|
|
|
+### Page Data
|
|
|
+<pre>{{ page }}</pre>
|
|
|
+
|
|
|
+### Page Frontmatter
|
|
|
+<pre>{{ frontmatter }}</pre>
|
|
|
+
|
|
|
+## More
|
|
|
+
|
|
|
+Check out the documentation for the [full list of runtime APIs](https://vitepress.dev/reference/runtime-api#usedata).
|