html转换成pdf
程序员文章站
2022-04-09 09:23:30
...
安装插件:
npm install --save html2canvas
npm install jspdf --save
引入 plugins/ htmlToPdf.js
import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'
export default{
install (Vue, options) {
Vue.prototype.getPdf = function () {
var title = this.htmlTitle
html2Canvas(document.querySelector('#pdfDom'), {
allowTaint: true
// allowTaint: false,
// useCORS: true
}).then(function (canvas) {
let contentWidth = canvas.width
let contentHeight = canvas.height
let pageHeight = contentWidth / 592.28 * 841.89
let leftHeight = contentHeight
let position = 0
let imgWidth = 595.28
let imgHeight = 592.28 / contentWidth * contentHeight
let pageData = canvas.toDataURL('image/jpeg', 1.0)
let PDF = new JsPDF('', 'pt', 'a4')
if (leftHeight < pageHeight) {
PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
} else {
while (leftHeight > 0) {
PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight
position -= 841.89
if (leftHeight > 0) {
PDF.addPage()
}
}
}
PDF.save(title + '.pdf')
}
)
}
}
}
上一篇: 单元测试JUnit
推荐阅读
-
css3 边框记_html/css_WEB-ITnose
-
请求高手帮忙,急需解决,感激不尽!_html/css_WEB-ITnose
-
CSS 让长字符串超过宽度时自动换行_html/css_WEB-ITnose
-
网站某个目录中全部是html文件,怎么控制用户必须登录才能访问这些静态文件
-
php数组生成html下拉列表的方法,php数组html下拉
-
thinkPHP的Html模板标签使用方法_php技巧
-
注销登录html与php,该怎么解决
-
Toolbar.js-实用的tooltip样式jQuery工具栏插件_html/css_WEB-ITnose
-
IE6不支持:hover伪类效果的解决办法_html/css_WEB-ITnose
-
输入两次密码不一致时,为什么弹出两次输入的密码一致_html/css_WEB-ITnose