vue 实现将 html 页面以 PDF 的格式展示到页面

最新推荐文章于 2024-07-12 15:14:43 发布

追逐原野.

最新推荐文章于 2024-07-12 15:14:43 发布

阅读量548

点赞数

文章标签： vue.js html javascript

本文链接：https://blog.csdn.net/m0_64564920/article/details/126424917

版权

vue 实现将 html 页面以 PDF 的格式展示到页面

1、下载两个包：`html2canvas` 、 `jspdf`

yarn add  html2canvas
yarn add  jspdf

2、书写 PDF 组件


import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'
const htmlToPdf = {
   
 getPdf(title) {
   
  window.pageYoffset = 0
  document.documentElement.scrollTop = 0
  document.body.scrollTop = 0

  setTimeout(() => {
   
  // 获取页面的 包含 id 为 pdfDom 的标签
   html2Canvas(document.querySelector('#pdfDom'), {
   
    allowTaint: true,
    scale: 2
   }).then((can