如何检测嵌套div (React)中的溢出？

.parentDiv {
  overflow: auto;
}

<div className="parentDiv">
  <div>嵌套的div内容</div>
</div>

class ParentComponent extends React.Component {
  componentDidMount() {
    this.checkOverflow();
  }

  componentDidUpdate() {
    this.checkOverflow();
  }

  checkOverflow() {
    const parentDiv = this.refs.parentDiv;
    const childDiv = this.refs.childDiv;

    if (parentDiv.clientHeight < childDiv.clientHeight) {
      console.log('嵌套div溢出');
    }
  }

  render() {
    return (
      <div ref="parentDiv" className="parentDiv">
        <div ref="childDiv">嵌套的div内容</div>
      </div>
    );
  }
}