From 654dcaef44e4ed13a819b2a5998cae1d90b1bb95 Mon Sep 17 00:00:00 2001 From: myron Date: Wed, 19 Jan 2022 07:29:12 +0000 Subject: [PATCH] fix: cellDomRef is undefined --- src/table/base/header.jsx | 24 ++++++++++++++++++------ src/table/base/resize.jsx | 5 ++--- 2 files changed, 20 insertions(+), 9 deletions(-) diff --git a/src/table/base/header.jsx b/src/table/base/header.jsx index 9339d4dc26..51fafedeba 100644 --- 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 index 836a54667a..5afa1df529 100644 --- 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;