fix: theme mode follow the system only auto (#5923)

* 修复主题在未设置为auto时,仍然会跟随系统主题变化的问题。
This commit is contained in:
Netfan 2025-04-12 01:16:57 +08:00 committed by GitHub
parent 9bd5a190c2
commit f46ec30995
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 16 additions and 9 deletions

View File

@ -198,9 +198,16 @@ class PreferenceManager {
window
.matchMedia('(prefers-color-scheme: dark)')
.addEventListener('change', ({ matches: isDark }) => {
this.updatePreferences({
theme: { mode: isDark ? 'dark' : 'light' },
});
// 如果偏好设置中主题模式为auto则跟随系统更新
if (this.state.theme.mode === 'auto') {
this.updatePreferences({
theme: { mode: isDark ? 'dark' : 'light' },
});
// 恢复为auto模式
this.updatePreferences({
theme: { mode: 'auto' },
});
}
});
}

View File

@ -106,7 +106,7 @@ export function setupVbenVxeTable(setupOptions: SetupVxeTable) {
initVxeTable();
useTableForm = useVbenForm;
const preference = usePreferences();
const { isDark, locale } = usePreferences();
const localMap = {
'zh-CN': zhCN,
@ -114,11 +114,11 @@ export function setupVbenVxeTable(setupOptions: SetupVxeTable) {
};
watch(
[() => preference.theme.value, () => preference.locale.value],
([theme, locale]) => {
VxeUI.setTheme(theme === 'dark' ? 'dark' : 'light');
VxeUI.setI18n(locale, localMap[locale]);
VxeUI.setLanguage(locale);
[() => isDark.value, () => locale.value],
([isDarkValue, localeValue]) => {
VxeUI.setTheme(isDarkValue ? 'dark' : 'light');
VxeUI.setI18n(localeValue, localMap[localeValue]);
VxeUI.setLanguage(localeValue);
},
{
immediate: true,