Vue3.js 中使用 PDF.js 嵌入 PDF 文件

<template>
  <div>
    <canvas ref='canvas'></canvas>
  </div>
</template>
<script>
import pdfjsLib from 'pdfjs-dist'

export default {
  mounted() {
    const canvas = this.$refs.canvas
    const ctx = canvas.getContext('2d')

    pdfjsLib.getDocument('path/to/pdf/file.pdf').promise.then((pdf) => {
      pdf.getPage(1).then((page) => {
        const viewport = page.getViewport({ scale: 1 })
        canvas.height = viewport.height
        canvas.width = viewport.width

        page.render({ canvasContext: ctx, viewport })
      })
    })
  }
}
</script>
<p>在此示例中，我们使用 PDF.js 库来加载 PDF 文件，并在 Canvas 元素上渲染第一页。您可以将此代码集成到 Vue 应用程序中，并使用 Vue 的数据绑定和事件处理程序来实现更高级的 PDF 呈现功能。</p>