Vue3预览并打印PDF

要预览并打印 PDF，您可以使用 `pdf.js` 库来实现。`pdf.js` 是一个开源的 JavaScript 库，可以在浏览器中渲染 PDF 文件。

下面是一个使用 `pdf.js` 预览并打印 PDF 的示例：

1. 首先，安装 `pdf.js` 库：

   npm install pdfjs-dist

2. 在 Vue 组件中引入 `pdf.js`：

   import pdfjsLib from 'pdfjs-dist'

3. 加载 PDF 文件：

   // 加载 PDF 文件
   const loadingTask = pdfjsLib.getDocument(url)

   // 获取 PDF 文件中的页面数量
   loadingTask.promise.then(pdf => {
     const numPages = pdf.numPages
     // ...
   })

4. 渲染 PDF 文件：

   // 渲染 PDF 文件
   const renderPage = pageNumber => {
     pdf.getPage(pageNumber).then(page => {
       const viewport = page.getViewport({ scale: 1 })
       const canvas = document.createElement('canvas')
       const context = canvas.getContext('2d')
       canvas.height = viewport.height
       canvas.width = viewport.width

       const renderContext = {
         canvasContext: context,
         viewport: viewport
       }

       page.render(renderContext).promise.then(() => {
         // 将渲染出的页面添加到页面上
         document.body.appendChild(canvas)
       })
     })
   }

5. 打印 PDF 文件：

   // 打印 PDF 文件
   const printPdf = () => {
     const printWindow = window.open(url)
     printWindow.print()
   }

这是一个简单的使用 `pdf.js` 预览并打印 PDF 的示例。您可以根据自己的需求进行修改和优化。