问题:最开始使用frame写的,但是在PC端可以,在移动端无法预览,提示要下载。为解决此问题,使用了vue-pdf插件。
npm i vue-pdf 安装插件
javascript<div> <pdf v-for="item in numPages" :key="item" :src="pdfSrc" :page="item" ref="pdf" style="display: inline-block;width: 100%;"> </pdf> </div> <script> data(){ pdfSrc:"",//路径 numPages: null, // pdf 总页数 } methods:{ getNumPages() { let loadingTask = pdf.createLoadingTask(this.pdfSrc) loadingTask.promise.then(pdf => { this.numPages = pdf._pdfInfo.numPages//这里是页码,可能赋值不一样,可以打印看一下 console.log("pdf",pdf,this.numPages) }).catch(err => { console.error('pdf 加载失败', err); }) }, } </script> <style> div { overflow:auto; } </style>