<!-- 文件预览组件 --> <script lang="ts" setup name="FilePreview"> import VuePdfEmbed from 'vue-pdf-embed' import * as pdfjsLib from 'pdfjs-dist' import { ElLoading } from 'element-plus' import { getBase64, getObjectURL } from '@/utils/download' import { getStream } from '@/api/business/subpackage/inform' // 打印文件url const props = defineProps({ id: { type: String, require: true, }, }) const pdfUrl = ref('') /** * 初始化 */ function init() { const loading = ElLoading.service({ lock: true, text: '加载中...', background: 'rgba(255, 255, 255, 0.6)', }) getStream({ id: props.id, pdf: true }).then((res) => { const base64 = getBase64(res.data).then((res) => { pdfUrl.value = res as string }) pdfjsLib.GlobalWorkerOptions.workerSrc = '/pdf.worker.js' loading.close() }) } onMounted(() => { init() }) </script> <template> <!-- pdf预览 --> <vue-pdf-embed ref="pdf" :source="pdfUrl" class="vue-pdf-embed" /> </template> <style lang="scss" scoped> // 样式 </style>