store 恢复

This commit is contained in:
超级老白兔
2025-08-02 18:42:43 +08:00
parent ae4cbd46dc
commit 4967f31791
4 changed files with 13 additions and 94 deletions

View File

@@ -156,9 +156,12 @@ const IframeDebugPage: React.FC = () => {
title="iframe调试"
right={
connectStatus ? (
<LoadingOutlined />
<CheckCircleOutlined style={{ color: "green" }} />
) : (
<CheckCircleOutlined color="green" />
<span>
<span style={{ marginRight: 4, fontSize: 12 }}>...</span>
<LoadingOutlined />
</span>
)
}
/>

View File

@@ -2,87 +2,15 @@
import { create } from "zustand";
import { persist, PersistOptions } from "zustand/middleware";
// 自定义存储引擎,确保使用 localStorage
const localStorageStorage = {
getItem: (name: string): string | null => {
try {
return localStorage.getItem(name);
} catch (error) {
console.error(`Failed to get item ${name} from localStorage:`, error);
return null;
}
},
setItem: (name: string, value: any): void => {
try {
localStorage.setItem(name, JSON.stringify(value));
} catch (error) {
console.error(`Failed to set item ${name} to localStorage:`, error);
}
},
removeItem: (name: string): void => {
try {
localStorage.removeItem(name);
} catch (error) {
console.error(`Failed to remove item ${name} from localStorage:`, error);
}
},
};
export function createPersistStore<T>(
createState: (set: any, get: any) => T,
name: string,
partialize?: (state: T) => Partial<T>,
options?: Partial<PersistOptions<T, Partial<T>>>,
) {
return create<T>()(
persist(createState, {
name,
partialize,
storage: localStorageStorage,
version: 1, // 版本控制,用于数据迁移
onRehydrateStorage: () => state => {
console.log(`Store ${name} rehydrated:`, state);
},
onError: error => {
console.error(`Store ${name} persistence error:`, error);
},
...options,
} as PersistOptions<T, Partial<T>>),
} as PersistOptions<T>),
);
}
// 工具函数:手动保存状态到 localStorage
export const saveToLocalStorage = <T>(name: string, state: T): void => {
try {
const serializedState = JSON.stringify(state);
localStorage.setItem(name, serializedState);
} catch (error) {
console.error(`Failed to save state to localStorage for ${name}:`, error);
}
};
// 工具函数:从 localStorage 加载状态
export const loadFromLocalStorage = <T>(name: string): T | null => {
try {
const serializedState = localStorage.getItem(name);
if (serializedState === null) {
return null;
}
return JSON.parse(serializedState);
} catch (error) {
console.error(`Failed to load state from localStorage for ${name}:`, error);
return null;
}
};
// 工具函数:清除 localStorage 中的状态
export const clearFromLocalStorage = (name: string): void => {
try {
localStorage.removeItem(name);
} catch (error) {
console.error(
`Failed to clear state from localStorage for ${name}:`,
error,
);
}
};

View File

@@ -12,9 +12,6 @@ export interface AppSettings {
// 功能设置
autoSave: boolean;
showTutorial: boolean;
//App设置
paddingTop: number;
}
interface SettingsState {
@@ -35,7 +32,6 @@ const defaultSettings: AppSettings = {
crashReportEnabled: true,
autoSave: true,
showTutorial: true,
paddingTop: 44,
};
export const useSettingsStore = createPersistStore<SettingsState>(

View File

@@ -27,22 +27,21 @@ interface UserState {
clearUser: () => void;
login: (token: string, userInfo: User, deviceTotal: number) => void;
logout: () => void;
updateUserInfo: (updates: Partial<User>) => void;
}
export const useUserStore = createPersistStore<UserState>(
(set, get) => ({
set => ({
user: null,
token: null,
isLoggedIn: false,
setUser: user => set({ user, isLoggedIn: true }),
setToken: token => set({ token }),
clearUser: () => set({ user: null, token: null, isLoggedIn: false }),
login: (token, userInfo, deviceTotal) => {
// 只将token存储到localStorage
localStorage.setItem("token", token);
// 用户信息存储在状态管理中
const user: User = {
id: userInfo.id,
account: userInfo.account,
@@ -62,18 +61,11 @@ export const useUserStore = createPersistStore<UserState>(
};
set({ user, token, isLoggedIn: true });
},
logout: () => {
// 清除localStorage中的token
localStorage.removeItem("token");
set({ user: null, token: null, isLoggedIn: false });
},
updateUserInfo: updates => {
const currentUser = get().user;
if (currentUser) {
const updatedUser = { ...currentUser, ...updates };
set({ user: updatedUser });
}
},
}),
"user-store",
state => ({