Vue pdfJs 预览PDF、图片

步骤如下:

1.下载pdfJs到本地(官网下载地址),放到项目根目录下的static文件夹内,将文件命名为pdfJs。

如下图

 

2. 使用iframe打开

<iframe id="pdfPlayer" src="URL"  frameborder="0" width="100%" height="600px"></iframe>

或者:<iframe id="pdfPlayer"   :src="pdfUrl3"  frameborder="0"    width="100%"   height="600px"></iframe>

需要注意的是: file参数中默认只允许传简单路径比如:http://www.aaa.com/aa.pdf. 如果你要浏览的pdf路径需要传参数的话。 这时候直接传入的话会解析出错, 因为pdf.js无法判断参数是viewer.html的参数呢还是aa.pdf的参数。所以,

URL 必须进行encode编码 ,encodeURIComponent() 把字符串编码为 URI 组件

 

 

发布了37 篇原创文章 · 获赞 2 · 访问量 5万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章