Instalar y configurar Vue Router en Vue3

En este artículo os voy a mostrar como instalar y configurar Vue Router en Vue3.

Pasos a seguir para instalar y configurar Vue Router en Vue 3

Tiempo necesario: 15 minutos.

Para instalar y configurar Vue Router en Vue3 tenemos que seguir los siguientes pasos

  1. Instalamos Vue Router

    Primero vamos a instalar Vue Router mediante npm. Para ello ejecutamos el siguiente comando:
    npm install vue-router@4

  2. Creamos el archivo router.js

    Dentro de la carpeta src creamos el archivo router.js con el siguiente contenido:

    import { createRouter, createWebHashHistory } from "vue-router";

    const routes = [


    { name: 'Home', path: "/", component: () => import('./components/Home.vue') },

    ];

    const history = createWebHashHistory();

    const router = createRouter({
    history,
    routes,
    });

    export default router;

  3. importamos la función useRouter()

    En el componente donde queramos usarlo importamos la función useRouter() de esta manera:

    import { useRouter } from "vue-router"

    export default {
    name: "ComponentePrueba",
    setup(){
    const router = useRouter()
    router.push("/")
    }
    }

Una vez realizados estos pasos ya tendríamos instalado Vue Router en nuestro proyecto.

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Las siguientes reglas del RGPD deben leerse y aceptarse:
Este formulario recopila tu nombre, correo electrónico y e contenido para que podamos realizar un seguimiento de los comentarios dejados en la web. Para más información revisa nuestra política de privacidad, donde encontrarás más información sobre dónde, cómo y por qué almacenamos tus datos.