前端实现PDf文件下载功能
南风贰拾捌 2024-06-15 17:03:02 阅读 56
前言:pc端需要实现生成PDF并下载的功能。
方法一:侧重点在前端,后端只需要配合把PDF所需要的数据给到前端即可。
准备工作:需要npm install 这两个插件,html2Canvas,JsPDF。
注:上面给的不是npm的命令,不可以直接当做npm命令使用
//引入import html2Canvas from 'html2canvas'import JsPDF from 'jspdf'// 也可以在main.js文件里面引入,并把getPdf方法绑定在vue实例上,全局使用
生成PDF的容器,里面样式根据需求自行加入
<div id="pdfDom"></div>
this.getPdf('name', '#pdfDom') //这里调用,传参可自定义,但id必须有
//核心代码getPdf(name, id) { const that = this html2Canvas(document.querySelector(id)<
上一篇: [前端]浏览器警告:Failed to resolve component: xxxIf this is a native custom element, make sure to exclude
下一篇: 后端接口返回文件流,前端实现docx/pdf/excel等类型文件的导出功能
本文标签
声明
本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。