javascript - React 子组件中父 html 元素的引用

Question

一个简单的Editor.jsx渲染 SVG 元素和名为 <SystemBox /> 的子组件的组件渲染方法

render() {
 return (
  <svg id="editor">
    <SystemBox />
  </svg>
 );
}

在 SystemBox.jsx我需要访问实际的 SVG html 元素，例如访问 getScreenCTM() SVG 元素上的方法。

如何将对父组件中的 SVG 元素的引用传递给子组件？

我想我可以使用document.getElementById('editor')在 SystemBox.jsx子组件，但这不对。

Answer 1

看看refs 。您可以创建对 svg DOM 元素的引用，并通过 props 将此引用传递给您创建的任何自定义组件。