若依框架前端部分笔记

917 阅读1分钟

若依页面加载组件位置 在public/index.html中

image.png

app.vue中路由重定向到首页部分

image.png

image.png

数据使用了pinia仓库存储,用户模块user.js中定义了token,用户名,用户角色,用户权限共享; 设置模块settings.js中定义了共享的皮肤颜色主题风格

image.png

image.png

动态路由和菜单权限 目前是在router/index.js预设的,正常是通过权限,后台获取路由表。菜单的组件上主要是遍历了sidebarRouters 这个是存储在仓库中的,利用发请求到后台获取用户的菜单权限,返回路由表。然后组件遍历来获取菜单

<sidebar-item
                    v-for="(route, index) in sidebarRouters"
                    :key="route.path  + index"
                    :item="route"
                    :base-path="route.path"
                />

若依框架有自定义了几个指令 在directive包下,permissions相关的自定义指令。一个权限指令,一个角色指令,用于判断某个角色或者某个权限,是否有权限操作某个按钮。即菜单中按钮权限的判断

image.png