Navegación programática

Código con cmposition API de HomeView

<template>
    <main>
        <h1>Esto es una página de Home</h1>
        <h3>Introduce tu nombre de usuario:</h3>
        <input v-model="username" type="text" placeholder="username" />
        <button @click="init">Iniciar sesión</button>
    </main>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';

const username = ref('');
const router = useRouter();

const init = () => {
    // Validación del backend
    if (username.value === 'pepito123') {
        router.push({
            path: '/chats',
            query: { var1: 1, var2: 2 },
        });
    }
};
</script>

.
Referencias:
Programmatic Navigation
Vue Router and the Composition API

Estaría bien utilizar estos métodos para cuando estamos en cierto menú con un URL diferente al base, solo tendríamos que retroceder 1 y estaríamos de nuevo en la ruta deseada 😃