在React应用程序中使用html-to-image的问题

Question

我正在尝试使用html- to -image来创建特定html卡的可下载图像。在其文档中，它指定使用

var node = document.getElementById('my-node');
htmlToImage.toPng(node)...

但这在真正的DOM上有效，而不是在react中。我试着使用裁判，但没有结果。卡和下载按钮位于组件层次结构中的不同分支中。

Answer 1

您是否尝试过使用新的React Ref

    class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }
  render() {
    return <div ref={this.myRef} />;
  }
}

要访问该元素，请使用：

const node = this.myRef.current;