import { createContext, useState } from "react";
export interface TypeContext {
darkMode: true | false;
setDarkMode: React.Dispatch<React.SetStateAction<boolean>>;
toggleMode: () => void;
}
export interface TypeChildrenProps {
children: JSX.Element;
}
export const GlobalThemeContext = createContext<TypeContext>({
darkMode: false,
setDarkMode: () => {},
toggleMode: () => {},
});
export const ThemeContextProvider = ({ children }: TypeChildrenProps) => {
const [darkMode, setDarkMode] = useState(false);
// useState(localStorage.getItem('Mode') ? JSON.parse(localStorage.getItem('Mode') : false))
// Argument of type 'string | null' is not assignable to parameter of type 'string'.
// Type 'null' is not assignable to type 'string'
const toggleMode = () => {
setDarkMode(!darkMode);
};
return (
<GlobalThemeContext.Provider value={{ darkMode, setDarkMode, toggleMode }}>
{children}
</GlobalThemeContext.Provider>
);
};
你好。我使用打字稿上下文在暗光模式下输入,一切正常。我已将其应用到其他页面,当您单击按钮时,模式会发生变化。唯一的问题是刷新后它就会消失。我怎样才能让它保留在本地存储中?