javascript - 如何在 React 中读取 DOM

Question

React 是单向的。

但是，有很多情况我们需要“获取”/读取 DOM，无论是获取父元素/还是 CSS 值。

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

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

非常感谢，

Answer 1

关于使用 refs，你是对的，你也可以使用原生 javascript dom 查询来实现，但是为元素设置 ref 更快。

所以基本上你像这样设置一个 ref:

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

然后在你的代码中做这样的事情:

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