antd-style icon indicating copy to clipboard operation
antd-style copied to clipboard

🐛[BUG] ant-design升级到最新版 5.20.1后,主题切换失效了(ThemeProvider)

Open anyone-yuren opened this issue 6 months ago • 1 comments

🐛 bug 描述

import { ThemeProvider } from 'antd-style';
import { v1CommonGetEnumDictionary } from 'apis';
import { useEffect, useState } from 'react';
import { HashRouter, RouterProvider } from 'react-router-dom';
import { useGlobalStore, useRcsGlobalStore } from 'store';
import { GlobalConfig } from 'ui';

import cyanImg from '@/assets/images/cyan-blur.png';
import redImg from '@/assets/images/red-blur.png';
import router, { Router } from '@/router';
import CustomGlobal from '@/styles/GlobalPager';

import LoadingPage from './components/LoadingPage';

function App() {
  const preset = useGlobalStore((state) => state.preset);
  const setDict = useRcsGlobalStore((state) => state.setDict);

  const [loading, setLoading] = useState(true);

  useEffect(() => {
    // 异步操作模拟(例如数据加载、初始化等)
    const asyncOperation = async () => {
      // 模拟异步操作
      await new Promise((resolve) => {
        setTimeout(resolve, 3000);
      });
      // 完成异步操作后,切换到主应用
      setLoading(false);
    };

    const getCommonDict = async () => {
      const dict = await v1CommonGetEnumDictionary({});
      Object.keys(dict).length && setDict(dict);
    };
    asyncOperation();
    getCommonDict();
  }, []); // 仅在组件挂载时执行

  console.log(preset);

  return (
    <GlobalConfig>
      <ThemeProvider
        defaultThemeMode='light'
        theme={{
          token: {
            colorPrimary: preset,
            colorInfo: '#00B8D9',
            colorSuccess: '#22C55E',
            colorWarning: '#FFAB00',
            colorError: '#FF5630',
            colorLink: preset,
          },
        }}
        customToken={{
          colorDefault: '#212b36',
          paperRedImg: redImg as string,
          paperCyanImg: cyanImg as string,
        }}
      >
        <CustomGlobal />
        {loading ? <LoadingPage /> : <RouterProvider router={router} />}
        {/* {loading ? (
          <LoadingPage />
        ) : (
          <HashRouter>
            <Router />
          </HashRouter>
        )} */}
      </ThemeProvider>
    </GlobalConfig>
  );
}

export default App;

preset是有变化的,之前antd:5.12版本是有效的,升级到5.20.1后,主题切换失效了。

📷 复现步骤

🏞 期望结果

💻 复现代码

可复现 demo

© 版本信息

  • antd-style 版本: [e.g. 3.6.1]
  • 浏览器环境
  • 开发环境 [e.g. mac OS]

🚑 其他信息

anyone-yuren avatar Aug 20 '24 03:08 anyone-yuren