DoliL in VitePressRuntime 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: 点我跳转：基础功能vuejs.org
🎉 💯
| Tables | Are | Cool |
|---|---|---|
| col 3 is | right-aligned | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |
INFO
这是一条信息，info后面的文字可修改
说明
这是一个提示，tip后面的文字可修改
警告
这是一条警告，warning后面的文字可修改
危险
这是一个危险警告，danger后面的文字可修改
点我查看
这是一条详情，details后面的文字可修改
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>html
<ul>
<li v-for="todo in todos" :key="todo.id">
{{ todo.text }}
</li>
</ul>ts
export default defineConfig({
lang: 'zh-CN',
title: "VitePress",
description: "我的vitpress文档教程",
description: "更详细的vitpress中文文档教程",
titleTemplate: '另起标题覆盖title' ,
})Results
Theme Data
{
"lastUpdated": true,
"editLink": {
"pattern": "https://dolimence.github.io/VitePressPages/:path",
"text": "Edit this page on GitHub"
},
"outlineTitle": "Document Content",
"outline": [
2,
6
],
"logo": "https://gitea.com/ZiqiWei/DoPic/raw/branch/main/vitePress/logo.svg",
"nav": [
{
"text": "Home",
"link": "/"
},
{
"text": "Content",
"link": "/content/"
},
{
"text": "Others",
"items": [
{
"text": "Notion",
"link": "https://dolimence.notion.site/DoliL-2bb88dd5ba57444c93305e96a458517f"
},
{
"text": "FlowUs",
"link": "https://flowus.cn/dolimence/share/78f4e9db-4b77-45af-ac85-0c828cc346dd【FlowUs 息流】DoliL in FlowUs"
},
{
"text": "VuePress",
"link": "/item-3"
}
]
},
{
"text": "Guide",
"items": [
{
"text": "Development Technology",
"items": [
{
"text": "VitePress",
"link": "/Design Development/VitePress/"
},
{
"text": "VuePress",
"link": "/Design Development/VuePress/"
},
{
"text": "Java",
"link": "/Back end Technology/Java/"
}
]
},
{
"text": "Desigin Technology",
"items": [
{
"text": "Blender",
"link": "/Design Development/Blender/"
},
{
"text": "Cubase10",
"link": "/Design Development/"
}
]
},
{
"text": "Other Skills",
"items": [
{
"text": "Matlab",
"link": "/Others/Matlab/"
},
{
"text": "Python",
"link": "/Others/Python/"
},
{
"text": "TensorFlow",
"link": "/Others/TensorFlow/"
},
{
"text": "Linux",
"link": "/Others/Liunx/"
}
]
}
]
},
{
"text": "About",
"link": "/About-Update/about"
}
],
"sidebar": {
"/content/": [
{
"text": "Front end Technology",
"collapsed": false,
"items": [
{
"text": "CSS",
"link": "/Front end Technology/CSS/"
},
{
"text": "HTML5",
"link": "/Front end Technology/HTML5/"
},
{
"text": "JavaScript",
"link": "/Front end Technology/JavaScript/"
},
{
"text": "React",
"link": "/Front end Technology/React/"
},
{
"text": "TypeScript",
"link": "/Front end Technology/TypeScript/"
},
{
"text": "Vue",
"link": "/Front end Technology/Vue/"
},
{
"text": "WeChat Applets",
"link": "/Front end Technology/WeChat Applets/"
},
{
"text": "Node.js",
"link": "/Front end Technology/Node.js/"
}
]
},
{
"text": "Back end Technology",
"collapsed": true,
"items": [
{
"text": "Java",
"link": "/Back end Technology/Java/"
},
{
"text": "SpringBoot",
"link": "/Back end Technology/SpringBoot/"
},
{
"text": "Docker",
"link": "/Back end Technology/Docker/"
},
{
"text": "Dubbo",
"link": "/Back end Technology/Dubbo/"
},
{
"text": "ElasticSearch",
"link": "/Back end Technology/ElasticSearch/"
},
{
"text": "PHP",
"link": "/Back end Technology/PHP/"
},
{
"text": "Mybatis",
"link": "/Back end Technology/Mybatis/"
},
{
"text": "Nginx",
"link": "/Back end Technology/Nginx/"
},
{
"text": "MongoDB",
"link": "/Back end Technology/MongoDB/"
},
{
"text": "Redis",
"link": "/Back end Technology/Redis/"
},
{
"text": "RabbitMQ",
"link": "/Back end Technology/RabbitMQ/"
}
]
},
{
"text": "Design Development",
"collapsed": true,
"items": [
{
"text": "Blender",
"link": "/Design Development/Blender/"
},
{
"text": "VitePress",
"link": "/Design Development/VitePress/"
},
{
"text": "VuePress",
"link": "/Design Development/VuePress/VuePress Started"
}
]
},
{
"text": "Others",
"collapsed": true,
"items": [
{
"text": "Git",
"link": "/Others/Git/"
},
{
"text": "Linux",
"link": "/Others/Liunx/"
},
{
"text": "Matlab",
"link": "/Others/Matlab/"
},
{
"text": "Python",
"link": "/Others/Python/"
},
{
"text": "R",
"link": "/Others/R/"
},
{
"text": "TensorFlow",
"link": "/Others/TensorFlow/"
}
]
}
],
"/About-Update/": [
{
"text": "About",
"link": "/About-Update/about"
},
{
"text": "Updated",
"link": "/About-Update/update"
}
],
"/Design Development/VuePress/": [
{
"text": "VuePress Started",
"link": "/Design Development/VuePress/VuePress Started"
},
{
"text": "目录结构",
"link": "/Design Development/VuePress/Directory Structure"
},
{
"text": "部署",
"link": "/Design Development/VuePress/Deploying"
}
]
},
"socialLinks": [
{
"icon": "github",
"link": "https://github.com/Dolimence/VitePressPages"
},
{
"icon": "x",
"link": "https://twitter.com/dolimence"
},
{
"icon": "slack",
"link": "https://app.slack.com/client/T03UCM34MCM/C03U13EH1B9"
}
],
"footer": {
"copyright": "Copyright@ 2024 Dolimence Wei"
},
"search": {
"provider": "local",
"options": {
"locales": {
"root": {
"translations": {
"button": {
"buttonText": "Search document",
"buttonAriaLabel": "search document"
},
"modal": {
"noResultsText": "no result found",
"resetButtonTitle": "clear query conditions",
"footer": {
"selectText": "select",
"navigateText": "switch"
}
}
}
},
"zh_CN": {
"translations": {
"button": {
"buttonText": "搜索文档",
"buttonAriaLabel": "搜索文档"
},
"modal": {
"noResultsText": "无法找到相关结果",
"resetButtonTitle": "清除查询条件",
"footer": {
"selectText": "选择",
"navigateText": "切换"
}
}
}
},
"ko": {
"translations": {
"button": {
"buttonText": "문서 검색",
"buttonAriaLabel": "문서 검색"
},
"modal": {
"noResultsText": "관련 결과를 찾을 수 없습니다.",
"resetButtonTitle": "쿼리 조건 지우기",
"footer": {
"selectText": "고르다",
"navigateText": "전달"
}
}
}
}
}
}
}
}Page Data
{
"title": "Runtime API Examples",
"description": "",
"frontmatter": {
"outline": "deep"
},
"headers": [],
"relativePath": "api-examples.md",
"filePath": "api-examples.md",
"lastUpdated": 1706243579000
}Page Frontmatter
{
"outline": "deep"
}More
Check out the documentation for the full list of runtime APIs.