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 组件