Search K
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
{
"blog": {
"pagesData": [
{
"route": "/modules/about/index",
"meta": {
"lastUpdated": true,
"publish": false,
"comment": true,
"sidebar": false,
"title": "关于我",
"date": "2025/07/21 13:47:23",
"tag": [],
"description": "关于我\n一位犹如咸鱼的普通人！\n欢迎您，来到我的个人博客，你，我生命中一个重要的过客，我们之所以是过客，因为你未曾会为我停留。\n在不断的技术学习和实践中，我始终保持着对新技术的热情和好奇心。\n作为一名",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/article/archives/index",
"meta": {
"editLink": false,
"lastUpdated": false,
"publish": false,
"comment": false,
"sidebar": false,
"title": "归档",
"date": "2025/07/24 16:03:50",
"tag": [],
"description": "TODO(rx-ted): show more archives\n- [ ] 搜索文章\n- [ ] 排序功能，如编写时间，字母",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/article/tags/index",
"meta": {
"title": "我的标签",
"editLink": false,
"lastUpdated": false,
"publish": false,
"comment": false,
"sidebar": false,
"date": "2025/07/21 13:47:23",
"tag": [],
"description": "<BlogTags /",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/changelog/en",
"meta": {
"date": "2024/09/19 00:00:00",
"sidebar": false,
"publish": false,
"sticky": 5,
"title": "🚀 Changelog",
"tag": [],
"description": "🚀 Changelog\n👉 Read this changelog in Chinese\nTrack the changes and updates for each iteration.\n 📦",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/changelog/todo",
"meta": {
"sidebar": false,
"publish": false,
"date": "2024/09/19 16:00:00",
"editLink": false,
"title": "✅︎ TODO",
"tag": [],
"description": "✅︎ TODO\n`TODO` 待办事项管理，用于指示一项尚未完成但需要将来注意或处理的任务.\n 待办事项\n- [ ] 版权声明 (copyright)\n- [ ] Mermaid - 图表\n- [ ]",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/changelog/zh",
"meta": {
"date": "2024/09/19 00:00:00",
"sidebar": false,
"publish": false,
"sticky": 5,
"title": "🚀 更新日志",
"tag": [],
"description": "🚀 更新日志\n👉 点击阅读英文版本\n记录每次迭代的变更与更新。\n 📦 项目运行命令\n请选择你的包管理器执行对应命令：\n:::code-group\n```bash [npm]\n 🧲 克隆项目\ng",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/comment/index",
"meta": {
"sidebar": false,
"publish": false,
"editLink": false,
"lastUpdated": false,
"title": "📝 欢迎留言",
"date": "2025/07/21 13:47:23",
"tag": [],
"description": "📝 欢迎留言\n这里是一个开放的小角落，你可以在这里分享你的想法、建议，或者只是简单打个招呼。\n如果你有不好的心情，也可以在这里向我倾诉，我会用心倾听并尽力回复你。\n无论是对博客内容的看法、使用上的问",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/editor/index",
"meta": {
"layout": "BlogEditor",
"title": "Markdown编辑器",
"editLink": false,
"lastUpdated": false,
"publish": false,
"comment": false,
"sidebar": false,
"date": "2025/07/21 13:47:23",
"tag": [],
"description": "",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/timeline/index",
"meta": {
"sidebar": false,
"editLink": false,
"publish": false,
"title": "timeline",
"date": "2025/07/21 13:47:23",
"tag": [],
"description": "timeline\n sharing my growing up and sharing important things\n```python\nimport os\nos.getcwd() [!code",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/utils/callback",
"meta": {
"title": "callback",
"layout": "Callback",
"editLink": false,
"lastUpdated": false,
"publish": false,
"comment": false,
"sidebar": false,
"date": "2025/07/21 13:47:23",
"tag": [],
"description": "",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/utils/login",
"meta": {
"layout": "BlogUserLogin",
"title": "登陆",
"editLink": false,
"lastUpdated": false,
"publish": false,
"comment": false,
"sidebar": false,
"date": "2025/07/24 16:03:50",
"tag": [],
"description": "",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/modules/utils/register",
"meta": {
"layout": "BlogUserRegister",
"title": "注册",
"editLink": false,
"lastUpdated": false,
"publish": false,
"comment": false,
"sidebar": false,
"date": "2025/07/24 16:03:50",
"tag": [],
"description": "",
"cover": "",
"hidden": true,
"recommend": false
}
},
{
"route": "/posts/bug/QtScrcpy利用tcp-ip把手机投影到电脑上",
"meta": {
"title": "QtScrcpy利用tcp_ip把手机投影到电脑上",
"date": "2023/02/16 21:38:55",
"tag": [
"踩坑笔记"
],
"author": "rx-ted",
"description": "利用tcp/ip把手机投影到电脑上，不需要数据线连接，利用同一个局限网，实现无线连接。",
"cover": "https://img-blog.csdnimg.cn/4a6846812352496ba7fad8e77964bf86.png"
}
},
{
"route": "/posts/config/Independent",
"meta": {
"author": "粥里有勺糖",
"original": false,
"description": "介绍如何在存量VitePress中引入使用或者使用主题中的部分功能",
"readingTime": false,
"tag": [
"配置"
],
"recommend": 2,
"outline": [
2,
3
],
"title": "⭐️存量VitePress项目中引入",
"date": "2025/07/24 14:28:19",
"cover": "https://img.cdn.sugarat.top/mdImg/MTY5NTk5NjYzMDU5MQ==695996630591"
}
},
{
"route": "/posts/config/component",
"meta": {
"author": "粥里有勺糖",
"original": false,
"description": "详细介绍主题内置提供的全局组件，三方插件，三方组件等能力。",
"title": "🔧 主题配置 - 组件能力",
"tag": [
"配置"
],
"date": "2025/07/24 14:28:19",
"cover": "https://loclink-1259720482.cos.ap-beijing.myqcloud.com/image/%E5%BD%95%E5%B1%8F2024-03-11%2023.51.51.gif"
}
},
{
"route": "/posts/config/frontmatter",
"meta": {
"author": "粥里有勺糖",
"original": false,
"description": "详细介绍首页&文章相关的各个配置项",
"title": "🔧 主题配置 - 首页&文章",
"readingTime": false,
"outline": [
2,
3
],
"tag": [
"配置"
],
"recommend": 1,
"date": "2025/07/24 14:28:19",
"cover": "https://img.cdn.sugarat.top/mdImg/MTY3MzE4MDM5ODQ3MQ==673180398471"
}
},
{
"route": "/posts/config/global",
"meta": {
"author": "粥里有勺糖",
"original": false,
"description": "详细介绍主题提供的全局能力",
"title": "🔧 主题配置 - 全局",
"readingTime": false,
"tag": [
"配置"
],
"recommend": 2,
"outline": [
2,
3
],
"date": "2025/07/24 14:28:19",
"cover": "https://img.cdn.sugarat.top/mdImg/MTY3OTIxNDY5MjE3NQ==679214692175"
}
},
{
"route": "/posts/config/inline-matter",
"meta": {
"author": "粥里有勺糖",
"original": false,
"description": "介绍Vitepress内置常用能力",
"title": "VitePress - 常用配置",
"tag": [
"配置"
],
"date": "2025/07/24 14:28:19",
"cover": "https://img.cdn.sugarat.top/mdImg/MTY3NzE2MzY5MzMyMA==677163693320"
}
},
{
"route": "/posts/config/style",
"meta": {
"author": "粥里有勺糖",
"original": false,
"description": "介绍一下自定义主题的部分样式",
"title": "🔧 主题配置 - 样式配置",
"readingTime": false,
"tag": [
"配置"
],
"recommend": 3,
"date": "2025/07/24 14:28:19",
"cover": "https://img.cdn.sugarat.top/mdImg/MTY3Njk5MTAzODkzOQ==676991038939"
}
},
{
"route": "/posts/iot/milkv-duo-ch340g串口通信_FIFO",
"meta": {
"title": "milkv-duo-ch340g串口通信_FIFO",
"date": "2023/05/20 13:15:05",
"description": "实现DSC28034PNT与其他设备之间的数据交互。我们将使用CH340G作为USB转串口芯片，将DSC28034PNT与计算机或其他外部设备连接。通过串口通信，DSC28034PNT可以接收来自计算机或其他外部设备的命令和数据，并将其用于控制和操作",
"tag": [
"IOT",
"嵌入式",
"milkv"
],
"cover": ""
}
},
{
"route": "/posts/iot/milkv-duo-env-compilation",
"meta": {
"title": "基于milkv-duo环境编译",
"date": "2023/05/20 13:15:05",
"description": "Milk-V Duo是一个基于CV1800B芯片的超紧凑嵌入式开发平台。它可以运行Linux和RTOS，为专业人士、工业ODM厂商、AIoT爱好者、DIY爱好者和创作者提供了一个可靠、低成本和高性能的平台。",
"tag": [
"IOT",
"嵌入式",
"milkv"
],
"cover": ""
}
},
{
"route": "/posts/iot/milkv-duo-i2c-ssd1306",
"meta": {
"title": "milkv-Linux下i2c驱动OLED ssd1306",
"date": "2023/07/18 17:45:19",
"tag": [
"IOT",
"嵌入式",
"milkv"
],
"description": "linux驱动移植-I2C驱动移植（OLED SSD1306）",
"cover": "https://file1.elecfans.com/web2/M00/8D/17/wKgZomS2Z9eAcM3HAAENkrlzuvg009.jpg"
}
},
{
"route": "/posts/iot/milkv-duo-windows不支持RNDIS-ssh登录解决方案",
"meta": {
"author": "rx-ted",
"title": "milkv-windows不支持RNDIS-ssh登录解决方案",
"date": "2023/05/20 13:15:05",
"description": "Milk-V Duo开发板在Windows系统下不支持RNDIS-SSH登录，用户无法通过此方式进行远程登录和管理。这对于那些习惯使用SSH进行远程操作的用户来说，可能会影响开发效率和使用体验。",
"tag": [
"IOT",
"嵌入式",
"milkv"
],
"cover": "/posts/doc/img/RNDIS.png"
}
},
{
"route": "/posts/iot/real-time-lcd",
"meta": {
"title": "实时显示 更进一步 又快又准",
"date": "2023/05/20 13:15:05",
"description": "FireBeetle 2 ESP32-S3可以使用Arduino IDE、ESP-IDF、MicroPython进行编程，C语言、python都可以轻松的操纵硬件。我选择以vscode为主，插件platformio，需要安装python3. Purple Pi开发板通过J12排针提供了丰富的GPIO接口，包括UART、SPI、I2C、GPIO等（还包括DC5V、DC3.3V、GND）。",
"tag": [
"IOT",
"嵌入式",
"Arduino"
],
"author": "rx-ted",
"cover": "https://img.dfrobot.com.cn/wiki/5d57611a3416442fa39bffca/a96b4c6cf0ffba8491af4ddd24442e87.jpg"
}
},
{
"route": "/posts/iot/基于Windows的ARMGCC开发环境",
"meta": {
"title": "基于Windows的ARMGCC开发环境",
"date": "2023/02/16 20:59:51",
"tag": [
"IOT",
"嵌入式",
"配置"
],
"author": "rx-ted",
"description": "本文以 N32G4FR 系列 MCU 为例，介绍了在 Windows 环境下基于 vscode 编辑器、GCC 编译工具链和 GDB 调试工具进行搭建开发环境、编译、固件下载和代码调试的方法。",
"cover": ""
}
},
{
"route": "/posts/iot/基于hexo框架借助github开发博客网站",
"meta": {
"title": "基于hexo框架借助github开发博客网站",
"date": "2023/03/04 22:11:18",
"tags": [
"经验"
],
"description": "我为什么开发这个博客网站?加强记忆，学习新技能，提升写作能力；记录生活，记录自己都日常；偶尔记录下每个不同人生阶段的感悟；分享给更多有共同兴趣爱好的小伙伴一起参与自己做的事。",
"tag": [
"经验"
],
"cover": ""
}
},
{
"route": "/posts/python/Python录音",
"meta": {
"author": "rx-ted",
"title": "Python 录音",
"date": "2023/02/16 21:41:47",
"tag": [
"Python"
],
"description": "MASR致力于简单，实用的语音识别项目",
"cover": ""
}
},
{
"route": "/posts/rule/Chinese for post Writing Guidelines",
"meta": {
"title": "中文投稿指南",
"recommend": 5,
"author": "rx-ted",
"date": "2024/01/01 00:00:00",
"tag": [
"guide"
],
"description": "中文投稿指南",
"sticky": 4,
"cover": ""
}
},
{
"route": "/posts/rule/English for post Writing Guidelines",
"meta": {
"title": "English for post Writing Guidelines",
"recommend": 1,
"author": "rx-ted",
"date": "2024/01/01 00:00:00",
"tag": [
"guide"
],
"description": "English for post Writing Guidelines",
"sticky": 4,
"cover": ""
}
},
{
"route": "/posts/vue/plugin/api-examples",
"meta": {
"outline": "deep",
"title": "Runtime API Examples",
"date": "2025/07/24 14:28:19",
"tag": [],
"description": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.",
"cover": ""
}
},
{
"route": "/posts/vue/plugin/markdown-examples",
"meta": {
"title": "Markdown Extension Examples",
"date": "2025/07/24 14:28:19",
"tag": [],
"description": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highl",
"cover": ""
}
},
{
"route": "/posts/vue/plugin/vitepress-plugin-tabs",
"meta": {
"tags": [
"vitepress",
"vue"
],
"title": "vitepress-plugin-tabs",
"date": "2025/07/24 14:28:19",
"tag": [
"vitepress",
"vue"
],
"description": "vitepress-plugin-tabs\nA plugin that adds syntax for showing content in tabs.\n Installation\n:::tabs\n=",
"cover": ""
}
}
],
"article": {
"analyzeTitles": {
"inlineWordCount": "{{value}} word counts",
"inlineReadTime": "{{value}} min read time",
"wordCount": "Total word count",
"readTime": "Total read time",
"author": "Author",
"publishDate": "Published on",
"lastUpdated": "Last updated on",
"tag": "Tags"
}
},
"formatShowDate": {
"justNow": "不久前",
"minutesAgo": " minutes ago"
},
"authorList": [
{
"nickname": "rx-ted",
"url": "https://rx-ted.github.io/blog/about/",
"des": "人生如戏 生活如诗 祸福难料 把握眼前"
}
],
"recommend": {
"nextText": "下一页"
},
"oml2d": false,
"friend": [
{
"nickname": "粥里有勺糖",
"des": "你的指尖,拥有改变世界的力量",
"avatar": "https://img.cdn.sugarat.top/mdImg/MTY3NDk5NTE2NzAzMA==674995167030",
"url": "https://sugarat.top"
},
{
"nickname": "Vitepress",
"des": "Vite & Vue Powered Static Site Generator",
"avatar": "https://vitepress.dev/vitepress-logo-large.webp",
"url": "https://vitepress.dev/"
}
],
"author": "rx-ted",
"home": {
"author": "rx-ted",
"logo": "/imgs/author.jpg"
},
"search": {
"pageResultCount": 5
},
"comment": {
"type": "giscus",
"options": {
"repo": "rx-ted/blog",
"repoId": "R_kgDOI-QZwQ",
"category": "Announcements",
"categoryId": "DIC_kwDOI-QZwc4CiHz6",
"inputPosition": "top"
}
},
"buttonAfterArticle": {
"openTitle": "投\"币\"支持",
"closeTitle": "下次一定",
"content": "<img src=\"https://rx-ted.github.io/picx-images-hosting/20250713/WechatIMG41.7eh2aj39yq.jpg\">",
"icon": "wechatPay"
},
"popover": {
"status": false,
"title": "公告",
"icon": "🔔",
"body": [
{
"type": "text",
"content": "👇 微信 👇"
},
{
"type": "image",
"src": "https://u.wechat.com/MEu7763RNC_JYLpb4To9-l8?s=2"
},
{
"type": "text",
"content": "欢迎大家私信交流"
},
{
"type": "button",
"content": "作者博客",
"link": "https://rx-ted.github.io/blog"
},
{
"type": "button",
"content": "关于我",
"props": {
"type": "success"
},
"link": "modules/about"
}
],
"duration": 0
},
"footer": {
"copyright": "2022-2025 rx-ted All rights reserved.",
"message": [
"点点滴滴，记录美好",
"MIT License"
],
"version": {
"name": "rx-ted/blog",
"link": "https://github.com/rx-ted/blog/tree/vitepress",
"icon": "🚀"
}
}
},
"sidebar": [
{
"text": "",
"items": []
}
],
"logo": "/imgs/logo.png",
"nav": [
{
"text": "🏠 首页",
"link": "/"
},
{
"text": "✍️ 写作",
"link": "/modules/editor"
},
{
"text": "🔍 探索",
"items": [
{
"text": "🚀 v1.0.0",
"link": "/modules/changelog/zh"
},
{
"text": "📂 归档",
"link": "/modules/article/archives"
},
{
"text": "🏷️ 标签",
"link": "/modules/article/tags"
}
]
},
{
"text": "🛠️ 工具",
"items": [
{
"text": "🤖 个人图床",
"link": "https://picx.xpoet.cn"
},
{
"text": "🖼️ ChatGPT",
"link": "https://rx-ted-wechat-bot.deno.dev"
}
]
},
{
"text": "👤 关于",
"link": "/modules/about"
},
{
"text": "💬 留言",
"link": "/modules/comment"
}
],
"lastUpdatedText": "上次更新于",
"outline": {
"level": "deep",
"label": "目录"
},
"returnToTopLabel": "回到顶部",
"sidebarMenuLabel": "相关推荐"
}
Page Data
{
"title": "Runtime API Examples",
"description": "",
"frontmatter": {
"outline": "deep"
},
"headers": [],
"relativePath": "posts/vue/plugin/api-examples.md",
"filePath": "posts/vue/plugin/api-examples.md",
"lastUpdated": 1753338499000
}Page Frontmatter
{
"outline": "deep"
}More
Check out the documentation for the full list of runtime APIs.