vue网页特定部分转成pdf并下载

先安装支持

将页面html转换成图片
npm install --save html2canvas
将图片生成pdf
npm install jspdf --save

 

组件引用：

import html2Canvas from 'html2canvas'

import jsPDF from 'jspdf'

 goToDownload(name){
        var _downDOM = document.querySelector('#forPrint');
        // 导出之前先将滚动条置顶,不然会出现数据不全的现象
        window.pageYOffset = 0;
        document.documentElement.scrollTop = 0
        document.body.scrollTop = 0;
        html2canvas(_downDOM, {
          allowTaint: true,//允许跨域（图片跨域相关）
          useCORS: true,// 如果截图的内容里有图片,可能会有跨域的情况,加上这个参数,解决文件跨域问题
        }).then(canvas => {
          var contentWidth = canvas.width;
          var contentHeight = canvas.height;
          console.log(contentWidth + '||' + contentHeight);
          //一页pdf显示html页面生成的canvas高度;
          var pageHeight = contentWidth / 592.28 * 841.89;
          //未生成pdf的html页面高