diff --git a/components/modal/__tests__/hook.test.tsx b/components/modal/__tests__/hook.test.tsx
index 16edbe4ac9..c4b5ff77da 100644
--- a/components/modal/__tests__/hook.test.tsx
+++ b/components/modal/__tests__/hook.test.tsx
@@ -72,6 +72,43 @@ describe('Modal.hook', () => {
jest.useRealTimers();
});
+ it('destroyAll works with contextHolder', () => {
+ const modalTypes = ['info', 'success', 'warning', 'error'] as const;
+
+ const Demo = () => {
+ const [modal, contextHolder] = Modal.useModal();
+
+ function showConfirm() {
+ modalTypes.forEach((type) => {
+ modal[type]({
+ title: 'title',
+ content: 'content',
+ });
+ });
+ }
+
+ return (
+
+ {contextHolder}
+
+ confirm
+
+
+ );
+ };
+
+ const { container } = render();
+ fireEvent.click(container.querySelectorAll('.open-hook-modal-btn')[0]);
+
+ expect(document.body.querySelectorAll('.ant-modal')).toHaveLength(modalTypes.length);
+
+ // Update instance
+ act(() => {
+ Modal.destroyAll();
+ });
+ expect(document.body.querySelectorAll('.ant-modal')).toHaveLength(0);
+ });
+
it('context support config direction', () => {
jest.useFakeTimers();
const Demo = () => {
diff --git a/components/modal/destroyFns.ts b/components/modal/destroyFns.ts
index 61d1d8a9a2..eaf13e4939 100644
--- a/components/modal/destroyFns.ts
+++ b/components/modal/destroyFns.ts
@@ -1,2 +1,2 @@
-const destroyFns: Array<() => void> = [];
+const destroyFns: Array = [];
export default destroyFns;
diff --git a/components/modal/useModal/index.tsx b/components/modal/useModal/index.tsx
index 1d89750889..ce4b1e55a8 100644
--- a/components/modal/useModal/index.tsx
+++ b/components/modal/useModal/index.tsx
@@ -5,6 +5,7 @@ import { withConfirm, withError, withInfo, withSuccess, withWarn } from '../conf
import type { ModalFuncProps } from '../Modal';
import type { HookModalRef } from './HookModal';
import HookModal from './HookModal';
+import destroyFns from '../destroyFns';
let uuid = 0;
@@ -69,6 +70,10 @@ function useModal(): readonly [
closeFunc = holderRef.current?.patchElement(modal);
+ if (closeFunc) {
+ destroyFns.push(closeFunc);
+ }
+
return {
destroy: () => {
function destroyAction() {