Reactjs React ref：什么等于document.querySelectorAll

我刚刚开始使用React ref，我想选择ref=this.contentRef的所有图标。 对于js，我会这样做：document.querySelectorAll（'.content I'）。如何使用ref进行此操作

someMethode() {
  const content = this.contentRef.current.childNodes;
  const content2 = document.querySelectorAll('.content i');
}

render() {
  return (
    <div ref={this.contentRef} className="content">
      <div>
        <i className="fa fa-square" />
      </div>
      <div>
        <i className="fa fa-square" />
      </div>
      <div>
        <i className="fa fa-square" />
      </div>
    </div>
  )
}

someMethode（）{
const content=this.contentRef.current.childNodes；
const content2=document.querySelectorAll（'.content i'）；
}
render（）{
返回(
)
}

正确的方法是：

---

this.myComponent=c}///然后检查this.myComponent是否未定义

您可以将QuerySelectorall与ReactDOM.findDOMNode一起使用（此） 试试这样的

const node = ReactDOM.findDOMNode(this);
// Get child nodes
if (node instanceof HTMLElement) {
const child = node.querySelector('.someClass');
}

---

这可能会出现空值的问题——这是一个警告，组件在每次更新时都会挂载和卸载。“如果ref回调被定义为内联函数，则在更新过程中会被调用两次，首先使用null，然后使用DOM元素。这是因为每次渲染都会创建一个新的函数实例，因此React需要清除旧的ref并设置新的ref。您可以通过将ref回调定义为绑定方法来避免这种情况。”但请注意，在大多数情况下，这并不重要。”您必须检查该值是否为null或未定义，这样就不会出现任何问题。在尝试访问ref时执行这些检查是一种常见的模式。这只是一个提示，在中不推荐使用react@16.6