前端如何不引入第三方插件实现pdf预览功能?

HTML 提供了一些原生标签,如embed、object和iframe,可以直接嵌入PDF文件,并在网页中展示。本文以object标签为例(其余标签感兴趣的,网上直接搜,有很多)

.vue文件

bash 复制代码
<object ref="pdfRef" :data="`${attachUrl}#toolbar=0`" type="application/pdf" width="100%" height="1000">
        This browser does not support PDFs. Please download the PDF to view it: <a :href="curData.agreementAttachUrl">Download PDF</a>
      </object>

attachUrl指的是pdf链接,如果在pdf链接后加入【#toolbar=0】,那么pdf上方的工具栏就会隐藏,可根据需求自行添加,默认是有工具栏

相关推荐
诸神缄默不语18 小时前
如何用Python处理文件:Word导出PDF & 如何用Python从Word中提取数据:以处理简历为例
python·pdf·word
i***665018 小时前
SpringBoot实战(三十二)集成 ofdrw,实现 PDF 和 OFD 的转换、SM2 签署OFD
spring boot·后端·pdf
777VG1 天前
Vue3+vue3-pdf-app@1.0.3实现加载 .pdf文件
前端·javascript·vue.js·pdf
ComPDFKit1 天前
Salesforce原生PDF编辑的重要性:效率、合规性与用户体验
大数据·pdf·ux
Forever777777771 天前
PDF瘦身,告别WPS收费压缩PDF
python·深度学习·pdf·免费
FreeBuf_1 天前
高危Markdown转PDF漏洞,可通过Markdown前置元数据实现JS注入攻击(CVE-2025-65108,CVSS 10.0)
开发语言·javascript·pdf
q***48412 天前
SpringBoot实战(三十二)集成 ofdrw,实现 PDF 和 OFD 的转换、SM2 签署OFD
spring boot·后端·pdf
SEO-狼术2 天前
Direct PDF Printing to .NET Applications
pdf
zyplayer-doc2 天前
目录支持批量操作,文档增加可见范围、锁定功能,PDF查看优化,zyplayer-doc 2.5.8 发布啦!
数据库·人工智能·pdf·编辑器·飞书·石墨文档
2501_930707783 天前
如何使用C#代码在 PDF 文档添加页码
pdf