无法找到反应HTML元素参考宽度和高度

2024-05-21 • 问答

因此，在弄乱了我的代码一段时间之后，我似乎无法使用react createRef解决方案找到HTML元素的宽度。在下面，您可以看到构造函数以及如何初始化引用。

constructor(props) {
    super(props);
    this.elementToTrack = React.createRef();
}

此后，我在要跟踪其大小的对象上创建引用。

<tr>
    <th ref={this.elementToTrack} classname="upperHeader">Location</th>
</tr>

这时，如果我要管理ref，它将显示我不确定的react元素/ dom元素。但是从这一点上，我不确定如何访问其当前的size属性。

我没有运气尝试过以下建议：

this.elementToTrack.current.offsetWidth;
this.elementToTrack.current.width;
this.elementToTrack.getBoundingClientRect();

任何帮助将不胜感激。

redrex5 回答：无法找到反应HTML元素参考宽度和高度

您可以使用简单的javascript的.offsetWidth和.offsetHeight属性来代替引用。像这样为您的th提供id属性：

<tr>
    <th ref={this.elementToTrack} id="sampleID" className="upperHeader">Location</th>
</tr>


var width = document.getElementById('sampleID').offsetWidth;
var height = document.getElementById('sampleID').offsetHeight;

这将返回您标签的当前宽度和高度。希望能与您合作。.

html javascript reactjs reference

本文链接：https://www.f2er.com/3118106.html

无法找到反应HTML元素参考宽度和高度

redrex5 回答：无法找到反应HTML元素参考宽度和高度

大家都在问