Estoy tratando de configurar un modelo en nuxt3 que verifica antes de cada solicitud si se permite el acceso a la ruta/ruta actual.
Actualmente probé dos enfoques diferentes, pero ninguno funcionó como se esperaba:
middleware/test.ts y llamándolo con middleware: ["test"] .composables/useFoo.ts y llamándolo con const foo = useFoo() dentro de app.vue Ambas soluciones tienen una función predeterminada exportada vacía que solo contiene una instrucción console.log . La declaración se imprimirá en la consola en la carga inicial, pero no antes/después de cambiar la ruta después de hacer clic en un NuxtLink . ¿Hay alguna otra solución para validar si la ruta solicitada está permitida, incluida la navegación con NuxtLink ?
Supongo que tengo un problema similar y busco la misma solución, extender páginas con (ganchos) es lo único que encontré que puede entrometerse con las rutas
hooks: { 'pages:extend' (pages) { pages.push( { "name": "index", "path": "/", "children": [], "file": resolve(__dirname, 'pages/test.vue') }, ) } },Lo primero que noté es que esto puede superar el comportamiento de nuxts propio vue-router que se acumula automáticamente usando el directorio de mis páginas. Pero lo segundo que noté es que, a diferencia de exendRoutes, no tomaré el siguiente parámetro: "beforeEnter: [fn()],
Así que todavía no puedo averiguar cómo hacer coincidir o redirigir en el ciclo de vida de enrutamiento....
Pero mi problema era el mismo que el tuyo. Necesito proteger la navegación... en mi caso. Tengo páginas anidadas, por ejemplo:
La configuración automática del enrutador Vue-Router siempre me lleva a la marca... Necesito una forma de verificar el parámetro y navegar a la marca/grupo de ruta correspondiente.
Esto parecía una solución: defineNuxtRouteMiddleware, addRouterMiddleWare, definepagemeta. Pero no pude importar addRouterMiddleWare, definepagemeta.
Quizás alguno de vosotros tenga más suerte..