我是否可以将dom节点转换为反应组件而不会丢失对该节点的引用？

Question

我有一个案例，我的一个子组件显示图像。源始终通过props传递。 但是：我的父组件需要引用图像的dom节点（或其对应的图像对象）。创建Image（作为对象）并将其传递给相应的组件会不会更容易？如果是这样的话：如何将DomNode / ImageObject转换为反应组件而而不使父节点中的引用无用？

我可以想象这被认为是不好的做法，甚至不可能。但是：我想尝试一下。

Answer 1

您可以通过传递函数来访问孩子的参考：

class Parent extends Component {
  render() {
    return (
      <ChildContainingImage imageRef={ (image) => this.image = image } />
    )
  }
}

class ChildContainingImage extends Component {
  render() {
    return (
      <img ref={ this.props.imageRef } />
    )
  }
}