javascript - 截取 React 应用程序的屏幕截图并将其生成为 PDF

Question

我想从我的 React 应用程序生成一个 PDF，最简单的方法可能是截取我的应用程序当前状态的屏幕截图/最好是一个 div 并将其保存为 PDF...我只是不似乎能够找到最佳方法。

有什么想法吗？

Answer 1

对于任何阅读此 pdfkit 的人来说，还可以在浏览器中生成 pdf...太好了!

你需要查看 pdfkit 网站，特别是我只使用 pdfkit 和 blob-stream 的浏览器版本让它工作

https://github.com/devongovett/pdfkit/releases https://github.com/devongovett/blob-stream/releases

我的代码看起来像

import PDFDocument from 'pdfkit'
import BlobStream from 'blob-stream'
import FileSaver from 'file-saver'

let doc = new PDFDocument()
    let stream = doc.pipe(BlobStream())
    addHeader(doc, 'My Report.....')
    doc.moveDown(0.5).fontSize(8)
   // render you doc
   // then add a stream eventListener to allow download
stream.on('finish', ()=>{
      let blob = stream.toBlob('application/pdf')
      FileSaver.saveAs(blob, 'myPDF.pdf')

    })
    doc.end()