feat: Modal.method support afterClose (#28053)

* Modal.method support afterClose

* Update index.en-US.md

* Update index.zh-CN.md

* docs(dropdown): improve demo (#28032)

* Modal.method support afterClose

* add afterClose test case

* resolve conflix

* Update index.en-US.md

Co-authored-by: 偏右 <afc163@gmail.com>
Co-authored-by: Tom Xu <ycxzhkx@gmail.com>

components/modal/Modal.tsx

@@ -95,6 +95,7 @@ export interface ModalFuncProps {
   // TODO: find out exact types
   onOk?: (...args: any[]) => any;
   onCancel?: (...args: any[]) => any;
+  afterClose?: () => void;
   okButtonProps?: ButtonProps;
   cancelButtonProps?: ButtonProps;
   centered?: boolean;

components/modal/__tests__/confirm.test.js

@@ -501,4 +501,24 @@ describe('Modal.confirm triggers callbacks correctly', () => {
     });
     jest.useRealTimers();
   });
+
+  it('trigger afterClose once when click on cancel button', () => {
+    const afterClose = jest.fn();
+    open({
+      afterClose,
+    });
+    // first Modal
+    $$('.ant-btn')[0].click();
+    expect(afterClose.mock.calls.length).toBe(0);
+  });
+
+  it('trigger afterClose once when click on ok button', () => {
+    const afterClose = jest.fn();
+    open({
+      afterClose,
+    });
+    // second Modal
+    $$('.ant-btn-primary')[0].click();
+    expect(afterClose.mock.calls.length).toBe(0);
+  });
 });

components/modal/confirm.tsx

@@ -81,7 +81,12 @@ export default function confirm(config: ModalFuncProps) {
     currentConfig = {
       ...currentConfig,
       visible: false,
-      afterClose: destroy.bind(this, ...args),
+      afterClose: () => {
+        if (typeof config.afterClose === 'function') {
+          config.afterClose();
+        }
+        destroy.apply(this, args);
+      },
     };
     render(currentConfig);
   }

components/modal/index.en-US.md

@@ -65,6 +65,7 @@ The items listed above are all functions, expecting a settings object as paramet
 
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
+| afterClose | Specify a function that will be called when modal is closed completely | function | - | 4.9.0 |
 | autoFocusButton | Specify which button to autofocus | null \| `ok` \| `cancel` | `ok` |  |
 | bodyStyle | Body style for modal body element. Such as height, padding etc | CSSProperties |  | 4.8.0 |
 | cancelButtonProps | The cancel button props | [ButtonProps](/components/button/#API) | - |  |

components/modal/index.zh-CN.md

@@ -68,6 +68,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/3StSdUlSH/Modal.svg
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
+| afterClose | Modal 完全关闭后的回调 | function | - | 4.9.0 |
 | autoFocusButton | 指定自动获得焦点的按钮 | null \| `ok` \| `cancel` | `ok` |  |
 | bodyStyle | Modal body 样式 | CSSProperties |  | 4.8.0 |
 | cancelButtonProps | cancel 按钮 props | [ButtonProps](/components/button/#API) | - |  |