Exemplo

No exemplo a seguir, chamamos uma API via useFetch usando um parâmetro de página dinâmico - slug - como parte da URL.

<script setup lang="ts">
const route = useRoute()
const { data: mountain } = await useFetch(`/api/mountains/${route.params.slug}`)
</script>

<template>
  <div>
    <h1>{{ mountain.title }}</h1>
    <p>{{ mountain.description }}</p>
  </div>
</template>

Se você precisar acessar os parâmetros de consulta da rota (por exemplo, example no caminho /test?example=true), então você pode usar useRoute().query em vez de useRoute().params.

API

Além dos parâmetros dinâmicos e parâmetros de consulta, useRoute() também fornece as seguintes referências computadas relacionadas à rota atual:

• fullPath: URL codificada associada à rota atual que contém caminho, consulta e hash
• hash: seção de hash decodificada da URL que começa com #
• query: acessa os parâmetros de consulta da rota
• matched: array de rotas correspondentes normalizadas com a localização da rota atual
• meta: dados personalizados anexados ao registro
• name: nome único para o registro da rota
• path: seção de caminho codificada da URL
• redirectedFrom: localização da rota que foi tentada acessar antes de terminar na localização da rota atual