|
1 | 1 | import { ConfigProvider } from 'antd'; |
2 | 2 | import zhCN from 'antd/locale/zh_CN'; |
3 | | -import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'; |
| 3 | +import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'; |
4 | 4 | import type { PropsWithChildren } from 'react'; |
5 | 5 | import { getThemeConfig, type ResolvedThemeMode } from './themeConfig'; |
6 | 6 | import { ThemeModeContext } from './themeContext'; |
@@ -61,7 +61,7 @@ export const ThemeProvider = ({ children }: PropsWithChildren) => { |
61 | 61 | const resolvedMode: ResolvedThemeMode = getResolvedMode(mode, systemMode); |
62 | 62 | const themeConfig = useMemo(() => getThemeConfig(resolvedMode), [resolvedMode]); |
63 | 63 |
|
64 | | - const setMode = (nextMode: ThemeMode) => { |
| 64 | + const setMode = useCallback((nextMode: ThemeMode) => { |
65 | 65 | if (nextMode === mode) { |
66 | 66 | return; |
67 | 67 | } |
@@ -105,7 +105,7 @@ export const ThemeProvider = ({ children }: PropsWithChildren) => { |
105 | 105 | root.removeAttribute('data-theme-transition'); |
106 | 106 | applyMode(); |
107 | 107 | } |
108 | | - }; |
| 108 | + }, [mode, resolvedMode, systemMode]); |
109 | 109 |
|
110 | 110 | useLayoutEffect(() => { |
111 | 111 | if (typeof document === 'undefined') { |
@@ -136,7 +136,7 @@ export const ThemeProvider = ({ children }: PropsWithChildren) => { |
136 | 136 | resolvedMode, |
137 | 137 | setMode, |
138 | 138 | }), |
139 | | - [mode, resolvedMode], |
| 139 | + [mode, resolvedMode, setMode], |
140 | 140 | ); |
141 | 141 |
|
142 | 142 | return ( |
|
0 commit comments