1 | initial version |
To utilize jsPDF's html() functionality within LWC, you need to follow these steps:
npm install jspdf --save
This will install the latest version of jsPDF in your project.
import jsPDF from 'jspdf';
const pdf = new jsPDF();
pdf.html(document.querySelector('#element-to-export'), {
callback: function(pdf) {
pdf.save('test.pdf');
}
});
In the above code, the first argument of the html() method is the HTML element that you want to export to PDF. The second argument is an options object that contains a callback function which is called when the PDF is generated. The callback function saves the PDF with a name 'test.pdf'.
<template>
<div>
<h1>Export to PDF</h1>
<div id="element-to-export">
<!-- HTML content to export to PDF -->
</div>
</div>
</template>
Replace the HTML content inside the '#element-to-export' with the content you want to export to PDF.
<template>
<div>
<h1>Export to PDF</h1>
<div id="element-to-export">
<!-- HTML content to export to PDF -->
</div>
<button onclick={exportToPdf}>Export to PDF</button>
</div>
</template>
exportToPdf() {
const pdf = new jsPDF();
pdf.html(document.querySelector('#element-to-export'), {
callback: function(pdf) {
pdf.save('test.pdf');
}
});
}
Now, when you click the 'Export to PDF' button, it will generate a PDF with the content inside the '#element-to-export' and save it with the name 'test.pdf'.