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>
相关推荐
winfredzhang10 小时前
为长阅读而生:我做了一个「安静」的 PDF 阅读器
pdf·html
100个铜锣烧19 小时前
文档处理管线:从PDF到向量——RAG系统的“第一道关口”
pdf
asdzx671 天前
在 React 中轻松实现 PDF 转 Word:纯前端 WASM 方案实战
前端·react.js·pdf
Lyn_Li1 天前
扫描 PDF 歪了怎么办?用 6 种检测方法做本地批量扶正(附开源工具)
python·pdf·ocr·tesseract·开源工具·文档处理·本地处理·扫描件纠偏
Mr.Daozhi2 天前
从零构建 AI 学术论文助手(四):PDF.js 实时截图 + Gemini 视觉分析
javascript·人工智能·pdf·canvas·pdf.js·gemini
wenxin77wx3 天前
3步部署OlmOCR:一行命令将PDF转为LLM训练数据
pdf·- olmocr
2501_930707784 天前
PDF 转 Markdown:在线与离线转换完整指南
pdf
ShiXZ2134 天前
PDF-OCR文件识别篇(七):数据入库
java·pdf·json·ocr·springboot
hong78174 天前
西门子触摸屏PROSAVE传输PDF组件没有选项
pdf·触摸屏·西门子
王莎莎-MinerU4 天前
当 RealDocBench 开始追问字段级问答,MinerU 为什么更适合做知识库与科研 Agent 的文档验收层
大数据·人工智能·算法·pdf·ocr