fix(table): header align无效；react16下固定列滚动报错 (#23)

* fix(table): header align无效 fix #190 * fix(table): react16下固定列滚动报错 Co-authored-by: yunfeic <chenyunfeijia@gmail.com>
Tencent · Dec 7, 2021 · 94eeafa · 94eeafa
1 parent 8602edb
commit 94eeafa
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 14 deletions.
diff --git a/src/table/base/Table.tsx b/src/table/base/Table.tsx
@@ -254,15 +254,17 @@ export default function BaseTable<D extends DataType = DataType>(props: BaseTabl
     setScrollableToRight(scrollableToRight);
   }
   function handleScroll(e) {
-    checkScrollableToLeftOrRight();
-
     const { scrollLeft, scrollTop } = e.target;
-    const direction = getScrollDirection(scrollLeft, scrollTop);
-    if (direction !== ScrollDirection.UNKNOWN) {
-      const scrollListenerFn = direction === ScrollDirection.X ? onScrollX : onScrollY;
-      const scrollParams = { e };
-      scrollListenerFn?.(scrollParams);
-    }
+
+    throttle(() => {
+      checkScrollableToLeftOrRight();
+      const direction = getScrollDirection(scrollLeft, scrollTop);
+      if (direction !== ScrollDirection.UNKNOWN) {
+        const scrollListenerFn = direction === ScrollDirection.X ? onScrollX : onScrollY;
+        const scrollParams = { e };
+        scrollListenerFn?.(scrollParams);
+      }
+    }, 100);
   }
 
   return (
@@ -292,7 +294,7 @@ export default function BaseTable<D extends DataType = DataType>(props: BaseTabl
               [`${classPrefix}-table-content--scrollable-to-left`]: scrollableToLeft,
             })}
             style={{ overflow: 'auto' }}
-            {...(hasFixedColumns ? { onScroll: throttle(handleScroll, 100) } : {})}
+            {...(hasFixedColumns ? { onScroll: handleScroll } : {})}
           >
             {!fixedHeader ? getTable() : getTableWithFixedHeader()}
           </div>

diff --git a/src/table/base/TableHeader.tsx b/src/table/base/TableHeader.tsx
@@ -95,7 +95,7 @@ const TableHeader = <D extends DataType>(props: TableHeaderProps<D>) => {
       {trsColumns.map((trsColumnsItem: CellProps<D>[], index) => (
         <tr key={index}>
           {trsColumnsItem.map((column: CellProps<D>, colIndex) => {
-            const { title, colKey, fixed, className, style = {}, rowSpan, colSpan, render } = column;
+            const { title, colKey, rowSpan, colSpan, render, ...rest } = column;
             const customRender = getCustomRender({ title, render });
 
             return (
@@ -105,12 +105,9 @@ const TableHeader = <D extends DataType>(props: TableHeaderProps<D>) => {
                 colKey={colKey}
                 colIndex={colIndex}
                 customRender={customRender}
-                style={style}
-                fixed={fixed}
-                columns={columns}
-                className={className}
                 rowSpan={rowSpan}
                 colSpan={colSpan}
+                {...rest}
               ></TableCell>
             );
           })}