微前端qiankun动态路由权限设计与数据通信方案

思路：

权限控制中心化：主应用负责统一的管理权限，子路由上报路由信息

动态路由加载：根据用户权限动态注册可用路由

数据通信机制

主应用和子应用：通过qiankun提供的props和全局状态

子应用和子应用：通过全局事件总线或状态管理

代码实现：

主应用配置：路由权限管理（src/permission.js）

import {asyncRoutes} from './router'
import {getPermissionFromApi} from '@/api/auth'

const permission = {
    state: {
        routes: [],
        addRoutes: []
    },
    mutations:{
        SET_ROUTES:(state,routes) => {
            state.addRoutes = routes
            state.routes = constantRoutes.concat(routes)
        }
    },
    actions:{
        // 生成动态路由
        GenerateRoutes({commit},roles)
    }
}