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

Question

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

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

但这适用于真实的 DOM 而不是反应。我尝试使用 refs 但它没有结果。卡片和下载按钮位于组件层次结构的不同分支中。

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;