如何在React中读取DOM

How to read DOM in React

本文关键字：读取 DOM React 更新时间：2023-09-26

React是单向的。

然而，在许多情况下，我们需要"获取"/读取DOM，无论是获取父元素/还是CSS值。

在我的例子中，我在div上设置了一个动态宽度属性，我想以绝对单位（px）获得它，React如何处理这种逻辑？我遇到过在React中使用"refs"的建议，但我不清楚这是否是推荐的方法。

CSS:
...
width: 60%;
...

非常感谢，

使用ref是对的，您也可以使用本机javascript dom查询，但为元素设置ref会更快。

所以基本上你设置了这样一个参考：

<div ref="awesome"></div>

然后在代码中执行以下操作：

var node = React.findDOMNode(this.refs.awesome);
alert(node.offsetWidth);