Files
2026-10-20 21:53:26 +08:00

1.6 KiB
Raw Permalink Blame History

H. 前端 Store 速查

:::tip 概述 Pinia store 模块速查(store/modules/ 七个):user/asyncRoute/tabsView/designSetting/projectSetting/lockscreen/ossConfig。详见 9.6 状态管理(Pinia)。 :::

模块速查

模块 职责 关键状态/动作
user.ts 登录与身份 token、userInfo;Login/GetInfo/LogOut
asyncRoute.ts 动态路由 菜单树、generateRoutes、isDynamicAddedRoute
tabsView.ts 标签页 visitedTabs、cachedTabs、delCachedTab
designSetting.ts 设计设置 主题色、水印、灰度/色弱
projectSetting.ts 项目设置 布局模式、标签页/面包屑开关
lockscreen.ts 锁屏 锁定状态、解锁
ossConfig.ts 存储配置 OSS 配置状态

辅助文件

store/index.ts          createPinia(含持久化插件)
store/mutation-types.ts 存储键常量(ACCESS_TOKEN / FIRST_ROUTE)
store/types.ts          类型定义
store/plugins/          持久化等插件

关键流转

登录:Login → data.access_token → storage(ACCESS_TOKEN) + store.token
首进:守卫 → GetInfo(getUser)→ userInfo.permissions
     → generateRoutes(getMenus)→ 动态路由注入
登出/401:清 storage + store → 跳登录

持久化:token/用户设置持久化;用户信息/菜单内存态(刷新重拉)

使用模式

import { useUserStore, useUserStoreWidthOut } from '@/store/modules/user';

const userStore = useUserStore();          // setup 内
const token = userStore.token;