前端开发Vue技术支持PDF预览功能
发布时间
阅读量:
阅读量
一、使用a标签
<a href="http://xxx.xx.cn/test1.pdf">pdf</a>
需特别注意的是,所使用的href地址必须指向文件的完整路径,而非相对路径。若将url设置为"…/assets/pdf/test1.pdf",则无法正确访问到对应的PDF文件。当用户点击该链接时,系统将在新窗口中打开并预览PDF文件,其效果与直接在浏览器中输入文件地址进行访问完全一致。
二、使用iframe标签
<div class="iframe-pdf">
<iframe src="http://xxx.xx.cn/test1.pdf"></iframe>
<iframe src="http://xxx.xx.cn/test2.pdf"></iframe>
</div>
该方式能够使PDF文档直接呈现在页面之上
三、使用pdfjs-dist插件
<template>
<div>
<div id="the-canvas"></div>
</div>
</template>
全部评论 (0)
还没有任何评论哟~
