From 6d569b9ccde0cc3cb25bfdb929b33aa80a576367 Mon Sep 17 00:00:00 2001
From: cp3hnu <cp3hnu@gmail.com>
Date: Mon, 29 Apr 2024 18:33:31 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=B7=BB=E5=8A=A0sessionStorage?=
 =?UTF-8?q?=E5=85=A8=E5=B1=80=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 react-ui/src/hooks/pageCacheState.ts |  2 +-
 react-ui/src/pages/Mirror/create.tsx |  7 ++-----
 react-ui/src/pages/Mirror/info.tsx   |  4 ++--
 react-ui/src/utils/sessionKeys.ts    |  2 --
 react-ui/src/utils/sessionStorage.ts | 30 ++++++++++++++++++++++++++++
 5 files changed, 35 insertions(+), 10 deletions(-)
 delete mode 100644 react-ui/src/utils/sessionKeys.ts
 create mode 100644 react-ui/src/utils/sessionStorage.ts

diff --git a/react-ui/src/hooks/pageCacheState.ts b/react-ui/src/hooks/pageCacheState.ts
index 7f9f20b2..9268a07a 100644
--- a/react-ui/src/hooks/pageCacheState.ts
+++ b/react-ui/src/hooks/pageCacheState.ts
@@ -44,7 +44,7 @@ export const useCacheState = () => {
   const key = 'pagecache:' + pathname;
 
   const setCacheState = useCallback(
-    (state: any) => {
+    (state?: any) => {
       if (state) {
         pageKeys.push(key);
         sessionStorage.setItem(key, JSON.stringify(state));
diff --git a/react-ui/src/pages/Mirror/create.tsx b/react-ui/src/pages/Mirror/create.tsx
index d50e8877..8ac38f6c 100644
--- a/react-ui/src/pages/Mirror/create.tsx
+++ b/react-ui/src/pages/Mirror/create.tsx
@@ -11,7 +11,7 @@ import SubAreaTitle from '@/components/SubAreaTitle';
 import { CommonTabKeys } from '@/enums';
 import { createMirrorReq } from '@/services/mirror';
 import { to } from '@/utils/promise';
-import { mirrorNameKey } from '@/utils/sessionKeys';
+import { getSessionItemThenRemove, mirrorNameKey } from '@/utils/sessionStorage';
 import { getFileListFromEvent } from '@/utils/ui';
 import { useNavigate } from '@umijs/max';
 import { Button, Col, Form, Input, Row, Upload, UploadFile, message, type UploadProps } from 'antd';
@@ -56,14 +56,11 @@ function MirrorCreate() {
   };
 
   useEffect(() => {
-    const name = sessionStorage.getItem(mirrorNameKey);
+    const name = getSessionItemThenRemove(mirrorNameKey);
     if (name) {
       form.setFieldValue('name', name);
       setNameDisabled(true);
     }
-    return () => {
-      sessionStorage.removeItem(mirrorNameKey);
-    };
   }, []);
 
   // 创建公网、本地镜像
diff --git a/react-ui/src/pages/Mirror/info.tsx b/react-ui/src/pages/Mirror/info.tsx
index b525cf04..8f26dd9f 100644
--- a/react-ui/src/pages/Mirror/info.tsx
+++ b/react-ui/src/pages/Mirror/info.tsx
@@ -17,7 +17,7 @@ import {
 } from '@/services/mirror';
 import themes from '@/styles/theme.less';
 import { to } from '@/utils/promise';
-import { mirrorNameKey } from '@/utils/sessionKeys';
+import { mirrorNameKey, setSessionStorageItem } from '@/utils/sessionStorage';
 import { modalConfirm } from '@/utils/ui';
 import { useNavigate, useParams, useSearchParams } from '@umijs/max';
 import {
@@ -149,7 +149,7 @@ function MirrorInfo() {
 
   const createMirrorVersion = () => {
     navigate(`/dataset/mirror/create`);
-    sessionStorage.setItem(mirrorNameKey, mirrorInfo.name || '');
+    setSessionStorageItem(mirrorNameKey, mirrorInfo.name || '');
     setCacheState({
       pagination,
     });
diff --git a/react-ui/src/utils/sessionKeys.ts b/react-ui/src/utils/sessionKeys.ts
deleted file mode 100644
index 522ce516..00000000
--- a/react-ui/src/utils/sessionKeys.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-// 用于新建镜像
-export const mirrorNameKey = 'mirror-name';
diff --git a/react-ui/src/utils/sessionStorage.ts b/react-ui/src/utils/sessionStorage.ts
new file mode 100644
index 00000000..fd006c7a
--- /dev/null
+++ b/react-ui/src/utils/sessionStorage.ts
@@ -0,0 +1,30 @@
+// 用于新建镜像
+export const mirrorNameKey = 'mirror-name';
+
+export const getSessionStorageItem = (key: string, isObject: boolean = false) => {
+  const jsonStr = sessionStorage.getItem(key);
+  if (!isObject) {
+    return jsonStr;
+  }
+  if (jsonStr) {
+    try {
+      return JSON.parse(jsonStr);
+    } catch (error) {
+      return undefined;
+    }
+  }
+  return undefined;
+};
+
+export const setSessionStorageItem = (key: string, state?: any, isObject: boolean = false) => {
+  if (state) {
+    sessionStorage.setItem(key, isObject ? JSON.stringify(state) : state);
+  }
+};
+
+// 获取之后就删除，多用于上一个页面传递数据到下一个页面
+export const getSessionItemThenRemove = (key: string, isObject: boolean = false) => {
+  const res = getSessionStorageItem(key, isObject);
+  sessionStorage.removeItem(key);
+  return res;
+};