Rutas dinámicas

Clase 16 de 17 • Curso de Vue.js: Navegación con Vue Router

Felix Torres Javier Antonio

student•

Tranquilos!!! 😇 Si ves otra vez lo mismo en el minuto 6:18 🧐, no es un "déjà vu". Sólo es un error de edición, tu sigue normal,

éxito y bendiciones 🙏🏻.

Brahyan Antonio Martinez Madera

student•

ahh XD

Ameth Ordoñez Erazo

student•

Otra forma en que pueden verificar si una ruta existe, el objeto router no proporciona la función router.hasRoute(), que comprueba si existe una ruta.

Así podemos validarla en el archivo App.vue:

 <nav>
        <RouterLink :to="{ name: 'home' }">Home</RouterLink>
        <RouterLink :to="{ name: 'about' }">About</RouterLink>
        <RouterLink :to="{ name: 'chats' }">Chats</RouterLink>
        <RouterLink :to="{ name: 'sesion' }">Sesión</RouterLink>
        <RouterLink v-if="router.hasRoute('profile')" :to="{ name: 'profile' }"
          >Profile</RouterLink
        >
      </nav>

Carlos Perilla

student•

Un aporte muy útil. Prefiero este enfoque para este caso particular. Muchas gracias!

Carlos Rodríguez

student•

Wao, una utilidad muy genial para este caso, esto es super util para otro caso cuando traemos datos del backend de el suer que inicia sesión y tiene un rol específico entonces en ciertas vistas no debe mostrarse cirtos enlaces. . Por ejemplo, tenemos un menú con 10 secciones en donde sólo lo manipulan los administradores, pero solo el rol de owner puede acceder a esas 10 secciones, el rol de manager podrá acceder a 8 secciones y el rol de admin a 6 secciones. Si el backen nos da datos de roles de quien inicia sesión con rutas dinámicas podemos generar vistas dinámicas también! . Veo que en la documentación también podemos remover rutas, esto podría aplicar a un user con una suscripción, pues tendrá acceso a ciertas rutas pero al eliminar su suscripción las rutas se la eliminan y no podrá acceder actualizando el estado al instante. Referencia: Dynamic Routing

Felix Torres Javier Antonio

student•

Sería un caso perfecto, el de esta plataforma de platzi, Cuando se te acaba la suscripción, solo puedes ver tu perfil, pero no puedes ver videos de los cursos.

Anderson Eduardo Arévalo Ramírez

student•

JAJAJ yo todo perdido cuando se repitió, como asiiiiiiii no entiendo jajajajaja gracias por la aclaración.

 <nav>
        <RouterLink :to="{ name: 'home' }">Home</RouterLink>
        <RouterLink :to="{ name: 'about' }">About</RouterLink>
        <RouterLink :to="{ name: 'chats' }">Chats</RouterLink>
        <RouterLink :to="{ name: 'sesion' }">Sesión</RouterLink>
        <RouterLink v-if="router.hasRoute('profile')" :to="{ name: 'profile' }"
          >Profile</RouterLink
        >
      </nav>

Rutas dinámicas

Introducción

Introducción a Vue Router

Setup inicial

Definición de rutas

Definición de rutas

Parámetros

Rutas anidadas

API de navegación

Navegación programática

Rutas con nombre

Redirección y alias

Componentes y props

Modos de historia

Navegación avanzada

Guardas de navegación

Rutas con metadatos

Obtención de datos

Composition API

Coincidencia de rutas

Rutas dinámicas

Despedida

Despedida del curso