Try to use only hook useResponsiveMap

ant-design · Dec 2, 2022 · 3d04fd1 · 3d04fd1
1 parent 2d9ca25
commit 3d04fd1
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/components/_util/__tests__/responsiveObserve.test.ts b/components/_util/__tests__/responsiveObserve.test.ts
@@ -1,8 +1,8 @@
-import ResponsiveObserve, { responsiveMap } from '../responsiveObserve';
+import ResponsiveObserve, { useResponsiveMap } from '../responsiveObserve';
 
 describe('Test ResponsiveObserve', () => {
   it('test ResponsiveObserve subscribe and unsubscribe', () => {
-    const { xs } = responsiveMap;
+    const { xs } = useResponsiveMap();
     const subscribeFunc = jest.fn();
     const token = ResponsiveObserve.subscribe(subscribeFunc);
     expect(ResponsiveObserve.matchHandlers[xs].mql.matches).toBeTruthy();

diff --git a/components/_util/responsiveObserve.ts b/components/_util/responsiveObserve.ts
@@ -20,8 +20,6 @@ const useResponsiveMap = (): BreakpointMap => {
   } as BreakpointMap;
 };
 
-export const responsiveMap: BreakpointMap = useResponsiveMap();
-
 type SubscribeFunc = (screens: ScreenMap) => void;
 const subscribers = new Map<Number, SubscribeFunc>();
 let subUid = -1;
@@ -51,6 +49,7 @@ const responsiveObserve = {
     if (!subscribers.size) this.unregister();
   },
   unregister() {
+    const responsiveMap: BreakpointMap = useResponsiveMap();
     Object.keys(responsiveMap).forEach((screen: Breakpoint) => {
       const matchMediaQuery = responsiveMap[screen];
       const handler = this.matchHandlers[matchMediaQuery];
@@ -59,6 +58,7 @@ const responsiveObserve = {
     subscribers.clear();
   },
   register() {
+    const responsiveMap: BreakpointMap = useResponsiveMap();
     Object.keys(responsiveMap).forEach((screen: Breakpoint) => {
       const matchMediaQuery = responsiveMap[screen];
       const listener = ({ matches }: { matches: boolean }) => {