fix: cellDomRef is undefined

alibaba-fusion · Jun 29, 2022 · 654dcae · 654dcae
1 parent d39a374
commit 654dcae
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 9 deletions.
diff --git a/src/table/base/header.jsx b/src/table/base/header.jsx
@@ -71,10 +71,22 @@ export default class Header extends React.Component {
             columnProps.ref(cell);
         }
     };
-
-    getCellDomRef = (i, j, cellDom) => {
+    
+    createCellDomRef = (i, j) => {
         const cellRefKey = this.getCellDomRefKey(i, j);
-        this[cellRefKey] = cellDom;
+        if (!this[cellRefKey]) {
+            this[cellRefKey] = {};
+        }
+
+        return this[cellRefKey];
+    };
+
+    getCellDomRef = (cellRef, cellDom) => {
+        if (!cellRef) {
+            return;
+        }
+
+        cellRef.current = cellDom;
     };
 
     getCellDomRefKey = (i, j) => {
@@ -124,7 +136,7 @@ export default class Header extends React.Component {
 
         const header = columns.map((cols, index) => {
             const col = cols.map((col, j) => {
-                const cellRefKey = this.getCellDomRefKey(index, j);
+                const cellRef = this.createCellDomRef(index, j);
                 /* eslint-disable no-unused-vars, prefer-const */
                 let {
                     title,
@@ -192,7 +204,7 @@ export default class Header extends React.Component {
                                 rtl={rtl}
                                 dataIndex={dataIndex}
                                 resizeProxyDomRef={resizeProxyDomRef}
-                                cellDomRef={this[cellRefKey]}
+                                cellDomRef={cellRef}
                                 onChange={onResizeChange}
                             />
                         );
@@ -235,7 +247,7 @@ export default class Header extends React.Component {
                         align={alignHeader ? alignHeader : align}
                         className={className}
                         ref={this.getCellRef.bind(this, index, j)}
-                        getCellDomRef={this.getCellDomRef.bind(this, index, j)}
+                        getCellDomRef={this.getCellDomRef.bind(this, cellRef)}
                         type="header"
                     >
                         {sortElement}

diff --git a/src/table/base/resize.jsx b/src/table/base/resize.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { findDOMNode } from 'react-dom';
 import T from 'prop-types';
 import { events, dom } from '../../util';
 
@@ -77,10 +76,10 @@ class Resize extends React.Component {
     };
     onMouseDown = e => {
         const { left: tableLeft, width: tableWidth } = this.props.tableEl.getBoundingClientRect();
-        if (!this.props.cellDomRef) {
+        if (!this.props.cellDomRef || !this.props.cellDomRef.current) {
             return;
         }
-        const { left: cellDomLeft } = this.props.cellDomRef.getBoundingClientRect();
+        const { left: cellDomLeft } = this.props.cellDomRef.current.getBoundingClientRect();
         this.lastPageX = e.pageX;
         this.tLeft = tableLeft;
         this.tRight = tableWidth;