vue 完美验证每个页面是否登陆的方法
时间: 2023-02-13 10:54:40 浏览: 82
vue 判断用户是否登陆
你可以使用 Vue 路由的守卫来完成这个功能。
首先,你需要在路由配置中为每个需要验证登录的路由设置一个路由守卫。这个守卫函数会在路由跳转之前运行,你可以在函数中检查用户是否已经登录,如果没有登录,就可以跳转到登录页面,或者终止路由跳转。
示例代码:
```
const routes = [
{
path: '/private',
component: PrivatePage,
beforeEnter: (to, from, next) => {
if (isLoggedIn()) {
next(); // 已登录,继续跳转
} else {
next('/login'); // 未登录,跳转到登录页
}
}
}
];
const router = new VueRouter({ routes });
```
在上面的代码中,我们为 `/private` 路由设置了一个路由守卫,在路由跳转之前会先运行守卫函数。如果用户已经登录,就调用 `next()` 继续跳转,否则就调用 `next('/login')` 跳转到登录页。
你也可以在 Vue 实例的全局守卫中设置同样的逻辑,这样就可以在所有路由跳转之前进行登录验证。
```
router.beforeEach((to, from, next) => {
if (to.matched.some(route => route.meta.requiresAuth)) {
// 路由中有 requiresAuth 标记,需要进行登录验证
if (isLog
阅读全文