vue2pdf在线预览移动端无法查看

问题:最开始使用frame写的,但是在PC端可以,在移动端无法预览,提示要下载。为解决此问题,使用了vue-pdf插件。

  1. 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>
相关推荐
森叶18 小时前
拆解 PDF 翻译引擎:表格纹丝不动、长语言自动缩放、图片文字 AI 重绘背后的工程
人工智能·pdf
AI创界者21 小时前
MinerU v3.4.4 离线部署实战:PDF/PPT/图片一键转 Markdown,低至 4G 显存/纯 CPU 可用
pdf·powerpoint
cosinmz1 天前
图片转PDF:手机合同照片如何整理成规范PDF文件
pdf·pdf转换·图片转pdf·图片转pdf小程序
a1117761 天前
深入理解 AI Agent PDF(设计原理与工程实践 )
pdf
CCC65A8780D2C1 天前
PaddleOCR-VL-1.6图片PDF文档解析识别成文本工具,解压就能用,完全本地离线
pdf
桐桐桐1 天前
技术文档翻译实践:保留PDF表格与版式的几种方案
pdf·自动化
王莎莎-MinerU1 天前
别让 Agent 重读 PDF:文档解析要交付可缓存资产
网络·数据库·人工智能·驱动开发·缓存·pdf·ocr
SamChan902 天前
在Web应用中集成PDF多语言翻译功能:PDFTranslator API实战指南
前端·python·ai·pdf·yapi·机器翻译
CCC65A8780D2C2 天前
OvisOCR2图片PDF识别精准识别成文字工具
pdf
AiMagicGaGa2 天前
免费在线 PDF 翻译工具实测:整份文档一键翻译,格式完全保留
自然语言处理·pdf·自动翻译