2024-07-08
한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina
En los marcos de aplicaciones de una sola página (SPA), como Vue.js, los protectores de ruta son una característica muy útil que le permite controlar el acceso a las rutas. Vue.js utiliza Vue Router como administrador de rutas oficial. Las guardias de enrutamiento se dividen principalmente en guardias globales y guardias intracomponentes.
A continuación se muestra un ejemplo de cómo configurar un protector de ruta para permitir que ciertas rutas sean accesibles públicamente:
beforeEach
El método configura una guardia frontal global para verificar si el usuario ha iniciado sesión y redirigir al usuario de acuerdo con el estado de inicio de sesión.// router/index.js
import Vue from 'vue';
import Router from 'vue-router';
import Home from '../components/Home.vue';
import Dashboard from '../components/Dashboard.vue';
Vue.use(Router);
const router = new Router({
routes: [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/dashboard',
name: 'Dashboard',
component: Dashboard,
meta: {
requiresAuth: true // 标记需要认证的路由
}
}
// 其他路由...
]
});
// 全局前置守卫
router.beforeEach((to, from, next) =