pc端html转pdf

import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'
export default { 
 getPdf(title,id) {
  html2Canvas(document.getElementById(id), {            allowTaint: true,
  }).then(canvas=>{            //内容的宽度
      let contentWidth = canvas.width;            //内容高度
      let contentHeight = canvas.height;            //一页pdf显示html页面生成的canvas高度,a4纸的尺寸[595.28,841.89];
      let pageHeight = contentWidth / 592.28 * 841.89;            //未生成pdf的html页面高度
      let leftHeight = contentHeight;            //页面偏移
      let position = 0;            //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
      let imgWidth = 595.28;            let imgHeight = 592.28 / contentWidth * contentHeight;            //canvas转图片数据
      let pageData = canvas.toDataURL('image/jpeg', 1.0);            //新建JsPDF对象
      let PDF = new JsPDF('', 'pt', 'a4');            //判断是否分页
      if (leftHeight < pageHeight) {
          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
      } else {                while (leftHeight > 0) {
              PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight);
              leftHeight -= pageHeight;
              position -= 841.89;                    if (leftHeight > 0) {
                  PDF.addPage()
              }
          }
      }            //保存文件
      PDF.save(title + '.pdf')
  })
}
};

<template>
  <div class="reportDetails">
    <div id="pdfDom">测试pdf内容</div>
    <div @click="creatPdf" class="bountsPdf">生成PDF</div>
  </div>
</template>

<script>
import  htmlToPdf  from "@/utils/htmlToPdf.js";
export default {
  data() {
    return {};
  },
  methods: {
    creatPdf() {
      console.log("pt", htmlToPdf);
      htmlToPdf.getPdf('test','pdfDom');  

    },
  },
};
</script>

<style>
.bountsPdf{
  margin: 2rem ;
  text-align: center;
  line-height: .9rem;
  color: #fff;
  background: #0BC296;;
}
</style>