vue3中使用pdf预览

在Vue3中使用pdf预览，可以使用第三方库pdfh5。具体步骤如下：
1. 安装pdfh5库：yarn add pdfh5
2. 在需要使用的页面引入pdfh5组件，并在template中添加相应的DOM结构，如下所示：

<template>
  <div id="pdf-view">
    <div id="pdf"></div>
  </div>
</template>

3. 在script中引入pdfh5库，并使用reactive和toRefs创建响应式数据，然后在onMounted钩子函数中初始化pdfh5组件，如下所示：

import Pdfh5 from "pdfh5";
import "pdfh5/css/pdfh5.css";
import { reactive, toRefs, onMounted } from "vue";

export default {
  name: "PdfView",
  setup() {
    const state = reactive({
      pdfh5: null,
    });

    onMounted(() => {
      state.pdfh5 = new Pdfh5("#pdf", { pdfurl: pdf的地址 });
      state.pdfh5.on("complete", function (status, msg, time) {
        console.log(
          "状态：" + status + "，信息：" + msg + "，耗时：" + time + "毫秒，总页数：" + this.totalNum
        );
      });
    });

    return {
      ...toRefs(state),
    };
  },
};

注意，pdf的地址需要根据实际情况进行修改。