fix: not crash on components (#838)

Author: zombieJ

src/Table.tsx

@@ -61,7 +61,7 @@ import BodyContext from './context/BodyContext';
 import Body from './Body';
 import useColumns from './hooks/useColumns';
 import { useLayoutState, useTimeoutLock } from './hooks/useFrame';
-import { getPathValue, mergeObject, validateValue, getColumnsKey } from './utils/valueUtil';
+import { getPathValue, validateValue, getColumnsKey } from './utils/valueUtil';
 import ResizeContext from './context/ResizeContext';
 import useStickyOffsets from './hooks/useStickyOffsets';
 import ColGroup from './ColGroup';
@@ -226,16 +226,11 @@ function Table<RecordType extends DefaultRecordType>(props: TableProps<RecordTyp
   }
 
   // ==================== Customize =====================
-  const mergedComponents = React.useMemo(
-    () => mergeObject<TableComponents<RecordType>>(components, {}),
-    [components],
-  );
-
   const getComponent = React.useCallback<GetComponent>(
     (path, defaultComponent) =>
-      getPathValue<CustomizeComponent, TableComponents<RecordType>>(mergedComponents, path) ||
+      getPathValue<CustomizeComponent, TableComponents<RecordType>>(components || {}, path) ||
       defaultComponent,
-    [mergedComponents],
+    [components],
   );
 
   const getRowKey = React.useMemo<GetRowKey<RecordType>>(() => {
@@ -811,15 +806,7 @@ function Table<RecordType extends DefaultRecordType>(props: TableProps<RecordTyp
       ),
       isSticky,
     }),
-    [
-      prefixCls,
-      getComponent,
-      scrollbarSize,
-      direction,
-      flattenColumns,
-      stickyOffsets,
-      isSticky,
-    ],
+    [prefixCls, getComponent, scrollbarSize, direction, flattenColumns, stickyOffsets, isSticky],
   );
 
   const BodyContextValue = React.useMemo(

src/utils/valueUtil.tsx

@@ -58,34 +58,6 @@ export function getColumnsKey(columns: readonly GetColumnKeyColumn[]) {
   return columnKeys;
 }
 
-export function mergeObject<ReturnObject extends object>(
-  ...objects: Partial<ReturnObject>[]
-): ReturnObject {
-  const merged: Partial<ReturnObject> = {};
-
-  /* eslint-disable no-param-reassign */
-  function fillProps(obj: object, clone: object) {
-    if (clone) {
-      Object.keys(clone).forEach(key => {
-        const value = clone[key];
-        if (value && typeof value === 'object') {
-          obj[key] = obj[key] || {};
-          fillProps(obj[key], value);
-        } else {
-          obj[key] = value;
-        }
-      });
-    }
-  }
-  /* eslint-enable */
-
-  objects.forEach(clone => {
-    fillProps(merged, clone);
-  });
-
-  return merged as ReturnObject;
-}
-
 export function validateValue<T>(val: T) {
   return val !== null && val !== undefined;
 }

tests/Table.spec.js

@@ -596,6 +596,21 @@ describe('Table.Basic', () => {
         errSpy.mockRestore();
       });
     });
+
+    it('not crash', () => {
+      const Looper = React.forwardRef(() => <td />);
+      Looper.looper = Looper;
+
+      mount(
+        createTable({
+          components: {
+            body: {
+              cell: Looper,
+            },
+          },
+        }),
+      );
+    });
   });
 
   it('align column', () => {