英文:
Vue.js generate pdf with html content
问题
有没有一些机会可以从HTML内容生成PDF。我的意思是类似于打印成PDF。我需要使用非常复杂的带有技术绘图(绝对位置等)的HTML,我需要获取整个Vue文件模板并生成PDF。
英文:
Is there some chance to generate PDF from HTML content. I mean something like print to PDF. I need to use very difficult html with technical draws (absolute positions, etc) and I need to take whole Vue file template and generate PDF.
答案1
得分: 1
这可以通过使用jspdf库来实现。
示例代码:
<div id="html">My HTML</div>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"></script>
<script>
var pdf = new jsPDF('p', 'pt', 'a4');
pdf.html(document.getElementById('html'), {
callback: function (pdf) {
pdf.save('a4.pdf');
}
});
</script>
英文:
This can be achieve with the jspdf library
http://raw.githack.com/MrRio/jsPDF/master/examples/html2pdf/showcase_supported_html.html
Example code:
<div id="html">My HTML</div>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"></script>
<script>
var pdf = new jsPDF('p', 'pt', 'a4');
pdf.html(document.getElementById('html'), {
callback: function (pdf) {
pdf.save('a4.pdf');
}
});
</script>
答案2
得分: 0
如下示例中,您可以使用Vue.js中的HTML下载PDF。
<div ref="content">
<h1>你好,世界!</h1>
</div>
downloadPDF() {
const doc = new jsPDF('p', 'pt', 'a4');
doc.html(this.$refs.content.innerHTML, {
callback: function (doc) {
doc.save('op.pdf');
},
x: 10,
y: 10,
});
}
希望这可以帮助您下载包含HTML内容的PDF。
英文:
as below example you can downwload the pdf with html in vue.js
<div ref="content">
<h1> hello wolrd ! </h1>
</div>
downloadPDF() {
const doc = new jsPDF('p', 'pt', 'a4');
doc.html(this.$refs.content.innerHTML, {
callback: function (doc) {
doc.save('op.pdf');
},
x: 10,
y: 10,
});}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论