React调用浏览器的打印

import html2canvas from "html2canvas"; // 导入此依赖
export default class LeaderArrangeTable extends React.Component {
  doPrint = (id) => { // 定义打印方法
    // 先用html2canvas将页面整个转为一张截图，再打印，防止出现echarts无法打印
    const dom = document.getElementById(id); //获取需要打印的区域
    html2canvas(dom, {
      scale: 2,
      width: dom.offsetWidth,
      height: dom.offsetHeight,
    }).then((canvas) => {
      const context = canvas.getContext("2d");
      context.mozImageSmoothingEnabled = false;
      context.webkitImageSmoothingEnabled = false;
      context.msImageSmoothingEnabled = false;
      context.imageSmoothingEnabled = false;
      const src64 = canvas.toDataURL();
      const contentWidth = canvas.width;
      const contentHeight = canvas.height;
      const imgWidth = 800; // 根据纸张宽度设定
      const imgHeight = (800 / contentWidth) * contentHeight;
      const img = new Image();
      const div = document.createElement("div");
      div.appendChild(img);
      img.setAttribute("src", src64);
      img.setAttribute("width", imgWidth);
      img.setAttribute("height", imgHeight);
      img.setAttribute("id", "imgs");
      div.setAttribute("id", "printImg");
      document.body.appendChild(div);
      window.document.body.innerHTML =
      window.document.getElementById("printImg").innerHTML;
      img.onload = () => {
        window.print(); // 调用浏览器打印
        window.location.reload();
      };
    });
render(){
   return (
   <div className="container" id = "container">
    <div className="table"  id = "table">我是table区域</div>
    <div className="table"  id = "table">我是content区域</div>
    <div onClick={() => this.handlePrint("table")}> 打印table区域</div>
    <div onClick={() => this.handlePrint("content")}> 打印content区域</div>
   </div>
    )
  }
}