From 40ab6c6226a67b87720403a3b5449c091f96552e Mon Sep 17 00:00:00 2001
From: fz6m <59400654+fz6m@users.noreply.github.com>
Date: Fri, 10 Nov 2023 02:45:45 +0800
Subject: [PATCH] docs: functional

---
 docs/docs/docs/max/antd.md  | 19 ++++++++++++++++---
 examples/with-antd-5/app.ts |  3 +++
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/docs/docs/docs/max/antd.md b/docs/docs/docs/max/antd.md
index fbc532385631..c5dc72f9f827 100644
--- a/docs/docs/docs/max/antd.md
+++ b/docs/docs/docs/max/antd.md
@@ -161,14 +161,16 @@ export const antd: RuntimeAntdConfig = (memo) => {
 };
 ```
 
-### 动态切换主题
+### 动态切换全局配置
 
 **注意：该功能仅 antd v5 可用**
 
-当存在主题相关的配置时开启
+通过 `useAntdConfig` / `useAntdConfigSetter` 方法来动态获取、修改 antd 的 `ConfigProvider` 配置，通常可用于动态修改主题。
+
+注：此功能需依赖 `ConfigProvider` ，请一并开启 `configProvider: {}` 。
 
 ```tsx
-import { Layout, Space, Button, version, theme } from 'antd';
+import { Layout, Space, Button, version, theme, MappingAlgorithm } from 'antd';
 import { useAntdConfig, useAntdConfigSetter } from 'umi';
 const { darkAlgorithm, defaultAlgorithm } = theme;
 
@@ -183,6 +185,7 @@ export default function Page() {
         <Switch
           checked={antdConfig?.theme?.algorithm.includes(darkAlgorithm)}
           onChange={(data) => {
+            // 此配置会与原配置深合并
             setAntdConfig({
               theme: {
                 algorithm: [
@@ -190,6 +193,16 @@ export default function Page() {
                 ],
               },
             });
+            // or 
+            setAntdConfig((config) => {
+              const algorithm = config.theme!.algorithm as MappingAlgorithm[];
+              if (algorithm.includes(darkAlgorithm)) {
+                config.theme!.algorithm = [defaultAlgorithm]
+              } else {
+                config.theme!.algorithm = [darkAlgorithm];
+              }
+              return config;
+            });
           }}
         ></Switch>
       </Space>
diff --git a/examples/with-antd-5/app.ts b/examples/with-antd-5/app.ts
index 61774c929b2a..5c663679a3f0 100644
--- a/examples/with-antd-5/app.ts
+++ b/examples/with-antd-5/app.ts
@@ -1,3 +1,4 @@
+import { theme } from 'antd';
 import { RuntimeAntdConfig } from 'umi';
 
 export const antd: RuntimeAntdConfig = (memo) => {
@@ -5,5 +6,7 @@ export const antd: RuntimeAntdConfig = (memo) => {
   memo.appConfig.message ??= {};
   memo.appConfig.message.duration = 5;
 
+  memo.theme!.algorithm = theme.darkAlgorithm;
+
   return memo;
 };