javascript - 访问内联 SVG

Question

我正在从字符串中读取 SVG，然后使用 dangerouslySetInnerHTML 显示它。这工作正常，但有一件事我无法解决:

SVG 包含一些 <g> ，我需要向它们添加由 React 处理的点击处理程序。

由于 SVG 不是由 React 构建的，因此我没有找到向组添加点击处理程序的方法。

有什么想法吗？

Answer 1

您可以使用 componentDidMount 内的 findDOMNode 访问 DOM 元素。

componentDidMount () {
  const nodeList = ReactDOM.findDOMNode(this).getElementsByTagName('g')
  // Do things with nodeList here, e.g. map over and attach click event
}