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>
相关推荐
AmyLin_20012 小时前
PDF 色彩保真工程实践【3】上手实践:工程结构、依赖集成与一键构建运行
c++·visualstudio·pdf·zlib·vcpkg·libtiff·cmyk
2601_965912832 小时前
PDF转Word技术选型:2026年文档解析引擎性能对比与集成评估
pdf·word
鸿翼Macrowing20 小时前
**从一份 PDF 到一次 API 调用:企业 AI 能力的“最后一公里“**
人工智能·pdf·agent·数据治理·skill
工具派1 天前
发PDF给外部前先做脱敏:我用在线工具批量涂黑了身份证号和姓名(实操记录)
pdf
南风微微吹1 天前
【英一】考研英语一历年真题及答案解析PDF(1980-2026年)
考研·pdf
界面开发小八哥1 天前
界面控件DevExpress Office & PDF File v26.1新版亮点 - 全新的条码生成API
pdf·.net·devexpress·ui开发·文档控件·.net 10
'pi%'1 天前
LangGraph 多智能体实战:搭建电力政策跟踪 Agent,实现网页爬虫、OCR 与 PDF 文档自动化解析
爬虫·pdf·ocr
DevOpenClub2 天前
用网页快照、静态 HTML 和 PDF 转换接口构建网页归档 Agent
前端·人工智能·pdf·html
fthux3 天前
装闭 RenoPit 源码解析(13):生成AI装修闭坑PDF报告
人工智能·ai·pdf·开源·github
星星在线4 天前
怎么使用Python生成PDF,我开源了PDF Report Generator
python·pdf·开源