refactor: Replace ConfigConsumer to ConfigContext (#34365)

ant-design · Mar 8, 2022 · e1f453c · e1f453c
1 parent abed625
commit e1f453c
Showing 1 changed file with 16 additions and 26 deletions.
diff --git a/components/typography/Typography.tsx b/components/typography/Typography.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import classNames from 'classnames';
 import { composeRef } from 'rc-util/lib/ref';
-import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
+import { ConfigContext } from '../config-provider';
 import devWarning from '../_util/devWarning';
 
 export interface TypographyProps {
@@ -31,37 +31,27 @@ const Typography: React.ForwardRefRenderFunction<{}, InternalTypographyProps> =
   },
   ref,
 ) => {
-  let mergedRef = ref;
+  const { getPrefixCls, direction } = React.useContext(ConfigContext);
 
+  let mergedRef = ref;
   if (setContentRef) {
     devWarning(false, 'Typography', '`setContentRef` is deprecated. Please use `ref` instead.');
     mergedRef = composeRef(ref, setContentRef);
   }
 
+  const Component = component as any;
+  const prefixCls = getPrefixCls('typography', customizePrefixCls);
+  const componentClassName = classNames(
+    prefixCls,
+    {
+      [`${prefixCls}-rtl`]: direction === 'rtl',
+    },
+    className,
+  );
   return (
-    <ConfigConsumer>
-      {({ getPrefixCls, direction }: ConfigConsumerProps) => {
-        const Component = component as any;
-        const prefixCls = getPrefixCls('typography', customizePrefixCls);
-        const componentClassName = classNames(
-          prefixCls,
-          {
-            [`${prefixCls}-rtl`]: direction === 'rtl',
-          },
-          className,
-        );
-        return (
-          <Component
-            className={componentClassName}
-            aria-label={ariaLabel}
-            ref={mergedRef}
-            {...restProps}
-          >
-            {children}
-          </Component>
-        );
-      }}
-    </ConfigConsumer>
+    <Component className={componentClassName} aria-label={ariaLabel} ref={mergedRef} {...restProps}>
+      {children}
+    </Component>
   );
 };
 
@@ -70,6 +60,6 @@ const RefTypography = React.forwardRef(Typography);
 RefTypography.displayName = 'Typography';
 
 // es default export should use const instead of let
-const ExportTypography = (RefTypography as unknown) as React.FC<TypographyProps>;
+const ExportTypography = RefTypography as unknown as React.FC<TypographyProps>;
 
 export default ExportTypography;