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>
相关推荐
南风微微吹6 小时前
计算机二级MS Office历年真题试题及答案解析40套电子版PDF(含操作题和选择题)
pdf
小幂同学13 小时前
CAD图纸怎么转PDF和图片?CAD快速看图王(幂果)转换方法解析
pdf·cad
weixin_4692738115 小时前
银行流水 PDF 转 Excel 或者 CSV 完整指南
人工智能·pdf·excel
AI导出鸭19 小时前
腾讯ima的LaTeX生成PDF文件复制后数学公式乱码,怎样修改?AI导出鸭苹果版硬核拆解
人工智能·pdf·ai导出鸭
辣香牛肉面21 小时前
Wondershare PDFelement Professional v12.1.24.4310+OCR 万兴PDF编辑器
pdf·编辑器·ocr
点我头像干啥1 天前
004:多个PDF文件合并
开发语言·pdf·php
DS随心转插件2 天前
ChatGPT生成的pdf怎么导出 只要加个“AI导出鸭”
人工智能·chatgpt·pdf·deepseek·ai导出鸭
AI导出鸭2 天前
ChatGPT的LaTeX生成PDF文件复制后数学公式乱码,怎样修改?苹果用户的底层逻辑与优雅解法
人工智能·chatgpt·pdf·ai导出鸭
听风吹等浪起2 天前
004:多个PDF合并成一个PDF【网页版】
pdf·状态模式
SamChan902 天前
用PostgreSQL+pgvector构建PDF翻译记忆库:向量相似度检索+增量更新实战
数据库·python·ai·postgresql·pdf·wpf