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

{
  "nav": [
    {
      "text": "Home",
      "link": "/"
    },
    {
      "text": "Guias",
      "link": "/guides/intro-config",
      "activeMatch": "/guides/"
    },
    {
      "text": "Tópicos",
      "link": "/topics/architecture",
      "activeMatch": "/topics/"
    }
  ],
  "sidebar": {
    "/guides/": {
      "base": "/guides/",
      "items": [
        {
          "text": "Introdução",
          "collapsed": false,
          "items": [
            {
              "text": "Configurações Iniciais",
              "link": "intro-config"
            },
            {
              "text": "Pacotes de Conteúdo",
              "link": "intro-package"
            }
          ]
        },
        {
          "text": "Estruturas",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "structure-getting-started"
            },
            {
              "text": "Campos",
              "link": "structure-fields"
            },
            {
              "text": "Navegação",
              "link": "structure-navigation"
            }
          ]
        },
        {
          "text": "Fontes de Dados",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "dataset-getting-started"
            },
            {
              "text": "Avançado",
              "link": "dataset-advanced"
            }
          ]
        },
        {
          "text": "Visões",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "view-getting-started"
            }
          ]
        },
        {
          "text": "Paineis",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "panel-getting-started"
            }
          ]
        },
        {
          "text": "Dashboards",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "dash-getting-started"
            }
          ]
        },
        {
          "text": "Widgets",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "widget-getting-started"
            },
            {
              "text": "Elementos",
              "link": "widget-elements"
            },
            {
              "text": "Origem dos Dados",
              "link": "widget-datasource"
            },
            {
              "text": "Scripts",
              "link": "widget-scripts"
            }
          ]
        },
        {
          "text": "Ações",
          "collapsed": false,
          "items": [
            {
              "text": "Iniciando",
              "link": "action-getting-started"
            }
          ]
        },
        {
          "text": "Segurança",
          "collapsed": false,
          "items": [
            {
              "text": "Usuários",
              "link": "security-users"
            },
            {
              "text": "Perfis",
              "link": "security-profile"
            },
            {
              "text": "Grupos de Acesso",
              "link": "security-group"
            },
            {
              "text": "Permissões Avançadas",
              "link": "scurity-advanced"
            }
          ]
        },
        {
          "text": "Automação",
          "collapsed": false,
          "items": [
            {
              "text": "Pipeline",
              "link": "automation-pipeline"
            },
            {
              "text": "Relatório",
              "link": "automation-report"
            },
            {
              "text": "Alertas",
              "link": "automation-alert"
            },
            {
              "text": "Importação",
              "link": "automation-import"
            },
            {
              "text": "Migração",
              "link": "automation-migration"
            }
          ]
        },
        {
          "text": "Infrastructure",
          "collapsed": false,
          "items": [
            {
              "text": "Instalação",
              "link": "install"
            }
          ]
        }
      ]
    },
    "/topics/": {
      "base": "/topics/",
      "items": [
        {
          "text": "Tópicos",
          "collapsed": false,
          "items": [
            {
              "text": "Arquitetura",
              "link": "architecture"
            },
            {
              "text": "Estruturas",
              "link": "structures"
            },
            {
              "text": "Segurança",
              "link": "security"
            }
          ]
        }
      ]
    }
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/beyond-horizon"
    }
  ]
}

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.