const router = useRouter()

Se você só precisa da instância do roteador dentro do seu template, use $router:

<template>
  <button @click="$router.back()">Voltar</button>
</template>

Se você tem um diretório pages/, useRouter é idêntico em comportamento ao fornecido pelo vue-router.

Manipulação Básica

• addRoute(): Adiciona uma nova rota à instância do roteador. parentName pode ser fornecido para adicionar uma nova rota como filha de uma rota existente.
• removeRoute(): Remove uma rota existente pelo seu nome.
• getRoutes(): Obtém uma lista completa de todos os registros de rotas.
• hasRoute(): Verifica se uma rota com um determinado nome existe.
• resolve(): Retorna a versão normalizada de uma localização de rota. Também inclui uma propriedade href que inclui qualquer base existente.

const router = useRouter()

router.addRoute({ name: 'home', path: '/home', component: Home })
router.removeRoute('home')
router.getRoutes()
router.hasRoute('home')
router.resolve({ name: 'home' })

Baseado na API de Histórico

• back(): Volta no histórico, se possível, o mesmo que router.go(-1).
• forward(): Avança no histórico, se possível, o mesmo que router.go(1).
• go(): Move-se para frente ou para trás através do histórico sem as restrições hierárquicas impostas em router.back() e router.forward().
• push(): Navega programaticamente para uma nova URL ao adicionar uma entrada na pilha de histórico. É recomendado usar navigateTo em vez disso.
• replace(): Navega programaticamente para uma nova URL ao substituir a entrada atual na pilha de histórico de rotas. É recomendado usar navigateTo em vez disso.

const router = useRouter()

router.back()
router.forward()
router.go(3)
router.push({ path: "/home" })
router.replace({ hash: "#bio" })

Guardas de Navegação

O composable useRouter fornece os métodos auxiliares afterEach, beforeEach e beforeResolve que atuam como guardas de navegação.

No entanto, o Nuxt tem um conceito de middleware de rota que simplifica a implementação de guardas de navegação e proporciona uma melhor experiência para o desenvolvedor.

Tratamento de Promessas e Erros

• isReady(): Retorna uma Promise que é resolvida quando o roteador completa a navegação inicial.
• onError: Adiciona um manipulador de erros que é chamado toda vez que um erro não capturado ocorre durante a navegação.

Instância Universal do Roteador

Se você não tem uma pasta pages/, então useRouter retornará uma instância universal do roteador com métodos auxiliares semelhantes, mas esteja ciente de que nem todos os recursos podem ser suportados ou se comportar exatamente da mesma forma que com vue-router.