由于需求和安全性原因,将原来由前端根据用户权限去添加、剔除的路由逻辑改为由后端将不同权限的路由发送至前端进行路由拼接的写法(其实我也不清楚哪里不安全...没有进行注册的路由是无法访问的...如果访问的了只能说明剔除的逻辑写的有问题)但是客户是这么要求的,没办法....😭
一、核心代码(能实现效果,但可以优化)
router.beforeEach((to, from, next) => {
const userStore = useUserStore()
const usePermissionStore = useUserPermissionStore()
if (to.path !== '/login') {
if (userStore.getToken) {
const isExist = router.hasRoute(to.name!)
// 用于解决动态路由刷新白屏问题
if (!isExist) {
usePermissionStore.getDynamicRoutes.forEach(item => {
item.component = () => import(`@/layout/index.vue`)
if (item.children.length > 0) {
item.children.forEach((items: any) => {