fix: 修复Token失效后登录页渲染异常

Author: lingting

src/layouts/BasicLayout.tsx

@@ -16,6 +16,7 @@ import MultiTab from '@/components/MultiTab';
 import { KeepAlive as ReactKeepAlive } from 'react-activation';
 import Notify from '@/utils/NotifyUtils';
 import Header from '@/components/Header';
+import { useAliveController } from 'react-activation';
 
 export type BasicLayoutProps = {
   breadcrumbNameMap: Record<string, MenuDataItem>;
@@ -44,6 +45,9 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
     route,
   } = props;
 
+  const { clear } = useAliveController();
+  Notify.setCleanCache(clear);
+
   const { routeArray, firstPath, load, setLoad } = useModel('dynamic-route');
   const { initialState } = useModel('@@initialState');
   const { isContentFull } = useModel('full-screen');

src/utils/NotifyUtils.tsx

@@ -7,11 +7,12 @@ import { Token, User } from './Ballcat';
 
 export type NotifyProps = { id: string; content: string; title: string };
 let logoutModal: any;
+let cleanCache: any = () => {};
 
 const logoutHandler = () => {
-  Modal.destroyAll();
   User.clean();
   logoutModal = undefined;
+  cleanCache();
   const { pathname } = history.location;
   history.replace(`/user/login?redirect=${pathname}`);
 };
@@ -24,13 +25,16 @@ const readNotice = (id: string) => {
 };
 
 const Notify = {
+  setCleanCache: (clean: any) => {
+    cleanCache = clean;
+  },
   preview: (props: NotifyProps) => {
     Notify.notice({ ...props, id: '' });
   },
   notice: ({ id, content, title }: NotifyProps) => {
     Modal.info({
       title,
-      content: <div dangerouslySetInnerHTML={{ __html: content }}></div>,
+      content: <div dangerouslySetInnerHTML={{ __html: content }} />,
       width: 800,
       icon: (
         <NotificationOutlined
@@ -56,6 +60,8 @@ const Notify = {
       return;
     }
     Token.clean();
+    Modal.destroyAll();
+
     logoutModal = Modal.info({
       title: I18n.text('notify.logout.title'),
       content: I18n.text('notify.logout.content'),
@@ -64,6 +70,7 @@ const Notify = {
       okText: I18n.text('notify.logout.okText'),
       onOk: () => logoutHandler(),
       onCancel: () => logoutHandler(),
+      zIndex: 99999999,
     });
   },
 };