vue-pdf的使用方法及解决在线打印预览乱码


最近在用vue做项目的时候,页面中需要展示后端返回的PDF文件,于是便用到了vue-pdf,其使用方法为 :

npm install --save vue-pdf

官网地址:https://www.npmjs.com/package/vue-pdf

不多说了,直接上代码:





代码中引用了element-UI中的分页,可以将PDF文件分页展示在页面中,但是在点击打印按钮时,却出现了乱码:

 最后通过寻找答案,发现原始的打印页面,PDF格式乱码,主要是因为PDF里使用了自定义字体,不能识别,其解决方案为:

需要修改 node_moduls 中 vue-pdf 安装包的 pdfjsWrapper.js 文件

其中pdfjsWrapper.js为我修改后的文件,pdfWrapper1.js为原始未修改过的文件。

其修改可参考以下链接:

git-hup地址:https://github.com/FranckFreiburger/vue-pdf/pull/130/commits/253f6186ff0676abf9277786087dda8d95dd8ea7,

修改之后,在此点击打印按钮,发现已经正常了: