在router.js路由文件中
beforeEnter 表示在跳转到该页面之前拦截
router.beforeEach 表示不管什么路由切换时都会执行该方法

import { createRouter, createWebHashHistory } from 'vue-router'
import Home from '../views/home/Home'
import Login from '../views/login/Login'const routes = [{path: '/',name: 'Home',component: Home
}, {path: '/login',name: 'Login',component: Login,// 访问login页面之前执行beforeEnter (to, from, next) {// to 指的是即将跳转到的页面 也就是login页面// from 指的是上一个页面是哪里const { isLogin } = localStorage// next() 表示逻辑继续执行// 判断当前是否已登录 如果已经登录直接进主页 否则正常进入当前登录页面isLogin ? next({ name: 'Home' }) : next()}
}
]const router = createRouter({history: createWebHashHistory(),routes
})// 不管什么路由切换时都会执行该方法
router.beforeEach((to, from, next) => {// to 表示到哪去// from 表示从哪来// 登陆时向localStorage存一下登录状态const { isLogin } = localStorage;// 如果已登录 或 当前就在登录页 可以执行下一步, 否则 跳去登录页(isLogin || to.name === 'Login') ? next() : next({ name: 'Login' })
})export default router