Merge e5151e7 into d63bc29

react-component · Sep 13, 2021 · 3d87702 · 3d87702
2 parents d63bc29 + e5151e7
commit 3d87702
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 2 deletions.
diff --git a/src/Table.tsx b/src/Table.tsx
@@ -165,7 +165,10 @@ export interface TableProps<RecordType = unknown> extends LegacyExpandableProps<
   sticky?: boolean | TableSticky;
 }
 
-function Table<RecordType extends DefaultRecordType>(props: TableProps<RecordType>) {
+function InternalTable<RecordType extends DefaultRecordType>(
+  props: TableProps<RecordType>,
+  ref: React.MutableRefObject<HTMLDivElement>,
+) {
   const {
     prefixCls,
     className,
@@ -364,7 +367,9 @@ function Table<RecordType extends DefaultRecordType>(props: TableProps<RecordTyp
   );
 
   // ====================== Scroll ======================
-  const fullTableRef = React.useRef<HTMLDivElement>();
+  let fullTableRef = React.useRef<HTMLDivElement>();
+  fullTableRef = ref || fullTableRef;
+
   const scrollHeaderRef = React.useRef<HTMLDivElement>();
   const scrollBodyRef = React.useRef<HTMLDivElement>();
   const scrollSummaryRef = React.useRef<HTMLDivElement>();
@@ -831,6 +836,18 @@ function Table<RecordType extends DefaultRecordType>(props: TableProps<RecordTyp
   );
 }
 
+const TableRef = React.forwardRef(InternalTable);
+
+type InternalTableType = typeof TableRef;
+
+interface TableInterface extends InternalTableType {
+  Column: typeof Column;
+  ColumnGroup: typeof ColumnGroup;
+  Summary: typeof Summary;
+}
+
+const Table = TableRef as TableInterface;
+
 Table.Column = Column;
 
 Table.ColumnGroup = ColumnGroup;

diff --git a/tests/Table.spec.js b/tests/Table.spec.js
@@ -931,4 +931,24 @@ describe('Table.Basic', () => {
       expect(onExpandedRowsChange).toHaveBeenCalledWith(['parent', 'bamboo']);
     });
   });
+
+  it('should support custom ref', () => {
+    const spy = jest.spyOn(console, 'error').mockImplementation(() => {});
+
+    const columns = [
+      {
+        title: 'Name',
+        key: 'name',
+        dataIndex: 'name',
+      },
+    ];
+    const Wrapper = () => {
+      const ref = React.useRef();
+      return <Table ref={ref} columns={columns} />;
+    };
+    mount(<Wrapper />);
+    expect(spy).not.toBeCalled();
+
+    spy.mockRestore();
+  });
 });