您可以通过findDOMNodeof实现它，react-dom如下所示：

ReactDOM.findDOMNode(<instance-of-outermost-component>).getElementsByClassName('snap') // Returns the elements

如果你需要计数，

ReactDOM.findDOMNode(<instance-of-outermost-component>).getElementsByClassName('snap').length

您可以使用ReactDOM.findDOMNode. 尽管文档鼓励使用ref，但让我们看看它是如何工作的：

findDOMNode()

ReactDOM.findDOMNode(component)

如果此组件已安装到 DOM 中，则返回相应的原生浏览器 DOM 元素。此方法对于从 DOM 中读取值非常有用，例如表单字段值和执行 DOM 测量。在大多数情况下，您可以将 ref 附加到 DOM 节点并完全避免使用 findDOMNode。

当组件呈现为 null 或 false 时，findDOMNode 返回 null。当组件呈现为字符串时， findDOMNode 返回包含该值的文本 DOM 节点。从 React 16 开始，一个组件可能会返回一个具有多个子节点的片段，在这种情况下 findDOMNode 将返回与第一个非空子节点对应的 DOM 节点。

注意： findDOMNode 是一个用于访问底层 DOM 节点的逃生舱口。在大多数情况下，不鼓励使用此逃生舱口，因为它刺穿了组件抽象。findDOMNode 仅适用于已安装的组件（即已放置在 DOM 中的组件）。如果您尝试在尚未安装的组件上调用此方法（例如在尚未创建的组件上调用 render() 中的 findDOMNode()），则会引发异常。findDOMNode 不能用于功能组件。

另外让我们看看推荐的ref：

向类组件添加 Ref

当在声明为类的自定义组件上使用 ref 属性时，ref 回调接收组件的已安装实例作为其参数。例如，如果我们想包装上面的 CustomTextInput 以模拟它在挂载后立即被点击：

class AutoFocusTextInput extends React.Component {
    componentDidMount() {
      this.textInput.focusTextInput();
    }

    render() {
      return (
        <CustomTextInput
          ref={(input) => { this.textInput = input; }} />
      );
    }
}

请注意，这仅适用于将 CustomTextInput 声明为类的情况：

class CustomTextInput extends React.Component {
  // ...
}

Yoy 还可以this.props.children用来获取给定类的子节点数：

let snapCount = React.Children.toArray(this.props.children).filter((item) => item.props.className === 'snap').length;