uniapp浏览pdf文件

长春小霸王

已于 2022-03-15 21:47:09 修改

阅读量1.8k

点赞数

分类专栏： uniapp 文章标签： javascript webview 前端 uniapp

于 2022-03-15 21:45:56 首次发布

本文链接：https://blog.csdn.net/jbossjf/article/details/123513229

版权

uniapp 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

1、下载插件

官网下载地址
https://mozilla.github.io/pdf.js/getting_started/#download

2、存放目录

3、前端引用

<template>
<!--直接在新页面打开预览 -->
 
    <!-- <view style="width: 100%;" >
		     <web-view  :src="allUrl" class="pdfClass"></web-view>    				
		</view> -->
 
<!--如果是在已有的页面内插入 -->
	<iframe
	      width="100%"
	      height="500"
	      scrolling="no"
	      :src="allUrl"
	    ></iframe>
</template>
 
<script>
	
    export default {
        data() {
            return {
				src: '',
                allUrl:'',
				viewerUrl: '../code/static/pdfjs/web/viewer.html', // 格式化文件流的一个js 文件 
            }
        },
        onLoad(options) {
                let fileUrl = encodeURIComponent("jbossjf.pdf") // encodeURIComponent 函数可把字符串作为 URI 组件进行编码。
                this.allUrl = this.viewerUrl + '?file=' + fileUrl
          }
    }
</script>
 
<style>
 
</style>