ソースを参照

fix: 修正退出时缓存清理不完全

xyh 2 年 前
コミット
6f7eaec3f6

+ 3 - 13
packages/app/src/index.tsx

@@ -4,24 +4,14 @@ import '@styles/index.css';
 import {RootRoutes} from '@routes';
 import {createRoot} from 'react-dom/client';
 import {BrowserRouter} from 'react-router-dom';
-import {QueryClient, QueryClientProvider} from '@tanstack/react-query';
+import {QueryClientProvider} from '@tanstack/react-query';
 import {StrictMode, Suspense} from 'react';
 import {ConfigProvider} from 'antd';
 import {ThemeConfig} from 'antd/es/config-provider/context';
 import 'dayjs/locale/zh-cn';
 import zhCN from 'antd/es/locale/zh_CN';
 import {Loading} from '@components';
-
-const queryClient = new QueryClient({
-  defaultOptions: {
-    queries: {
-      refetchOnWindowFocus: false,
-      retry: false,
-      cacheTime: 0,
-      retryOnMount: true,
-    },
-  },
-});
+import {QUERY_CLIENT} from '@utils';
 
 const root = createRoot(document.getElementById('root')!);
 
@@ -38,7 +28,7 @@ const themeConfig: ThemeConfig = {
 };
 
 root.render(
-  <QueryClientProvider client={queryClient}>
+  <QueryClientProvider client={QUERY_CLIENT}>
     <StrictMode>
       <ConfigProvider theme={themeConfig} locale={zhCN}>
         <Suspense

+ 4 - 0
packages/app/src/stores/menu.ts

@@ -6,6 +6,7 @@ type State = {menus: TreeRoleMenuData[]};
 
 type Action = {
   setMenu(state: TreeRoleMenuData[]): void;
+  clear(): void;
 };
 
 export const menuStore = createStore<State & Action>(function (set) {
@@ -15,5 +16,8 @@ export const menuStore = createStore<State & Action>(function (set) {
       sessionStorage.setItem(MENU_STORAGE, JSON.stringify(menus));
       set({menus});
     },
+    clear() {
+      set({menus: []});
+    },
   };
 });

+ 10 - 4
packages/app/src/stores/user.ts

@@ -1,8 +1,8 @@
 import {UserLoginData} from '@models';
-import {QueryCache} from '@tanstack/react-query';
-import {USER_TOKEN_STORAGE} from '@utils';
+import {QUERY_CLIENT, USER_TOKEN_STORAGE} from '@utils';
 import {startTransition} from 'react';
 import {createStore} from 'zustand/vanilla';
+import {menuStore} from './menu';
 
 type UserStoreState = UserLoginData;
 
@@ -38,11 +38,17 @@ export const userStore = createStore<UserStoreState & UserStoreAction>(
         set(data);
       },
       logout() {
+        // 清除用户缓存
         sessionStorage.removeItem(USER_TOKEN_STORAGE);
         set(defaultValue());
+
         startTransition(function () {
-          const queryCache = new QueryCache();
-          queryCache.clear();
+          // 清除请求缓存
+          QUERY_CLIENT.clear();
+
+          // 清除菜单缓存
+          const {clear} = menuStore.getState();
+          clear();
         });
       },
       setMenu(menus) {

+ 14 - 1
packages/app/src/utils/constants.ts

@@ -1,3 +1,5 @@
+import {QueryClient} from '@tanstack/react-query';
+
 /** 用户session token */
 export const USER_TOKEN_STORAGE = 'userToken';
 /** 用户登录信息token */
@@ -30,7 +32,7 @@ export const MODAL_PAGE_SIZE_LIST = ['5', ...PAGE_SIZE_LIST];
 /** 请求域名 */
 export const NETWORK_URL =
   process.env.NODE_ENV === 'development'
-    ? 'https://67070297.r5.vip.cpolar.cn'
+    ? 'http://10.2.111.91:9560'
     : 'http://10.2.111.91:9560';
 export const E2E_NETWORK_URL = 'http://e2e.test.cn';
 /** 导出错误提示 */
@@ -78,3 +80,14 @@ export const ENTYR_NUMBER_COL_WIDTH = NORMAL_TABLE_WIDTH;
 export const COMPANY_COL_WIDTH = 280;
 /** 是否向gs回传 */
 export const ENABLED_GS = true;
+/** reqct-query client */
+export const QUERY_CLIENT = new QueryClient({
+  defaultOptions: {
+    queries: {
+      refetchOnWindowFocus: false,
+      retry: false,
+      cacheTime: 0,
+      retryOnMount: true,
+    },
+  },
+});