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 小时前
jquick-pdf 表格实战:动态数据 PDF 报表生成
java·开发语言·pdf
泡海椒10 小时前
jquick-pdf 表格行列尺寸控制实战:单元格合并的可行边界
java·开发语言·pdf
java_logo1 天前
Docker 部署 Gotenberg 完整教程:Compose 搭建文档转 PDF API
docker·pdf·chromium·libreoffice·文档转换·轩辕镜像·gotenberg
泡海椒1 天前
jquick-pdf 防止 PDF 内容分页断裂:keepTogether 属性妙用
java·开发语言·pdf
泡海椒1 天前
jquick-pdf 文本元素实战:段落、行内文本、制表符用法详解
java·开发语言·pdf
SamChan902 天前
Python 处理小语种 PDF 的编码坑:重音字符、连字与 (cid:xx) 乱码的解决方案
python·ai·pdf·机器翻译
微咣科技2 天前
平台化工业AI再突破|大捷智能携手岚图汽车,打造车身焊装智能设计行业标杆
pdf·音视频
我滴老baby2 天前
工业物联网数据库选型:把计算能力放回第一维度
数据库·人工智能·架构·pdf
SamChan902 天前
多栏PDF阅读顺序重建:用Python按坐标聚类还原双栏论文的翻译顺序
python·ai·pdf
浩风祭月2 天前
ChatGPT上传PDF后漏读图表?文字版、扫描件和图片要分开处理
人工智能·chatgpt·pdf·提示词·办公效率